发布这篇文章的目的在于,测试文章详情页的自带的CSS样式是否适配UEditor编辑器发布的内容。
你也可以复制我们这篇文章的代码右键查看网页源代码,放在你自己网站后台的文章编辑中html模式下粘贴,发表文章后,测试你使用的网站模板文章详情页自带的CSS样式是否支持UEditor编辑器发布的内容。
1、加粗

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
2、斜体

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
3、下划线

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
4、删除线

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
5、上标

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
6、下标

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
7、字体颜色

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
8、背景色

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
9、有序列表

1、2、3……
- 第一行文字 
- 第二行文字 
- 第三行文字 
- 第四行文字 
- 第五行文字 
- …… 
a、b、c……
- 第一行文字 
- 第二行文字 
- 第三行文字 
- 第四行文字 
- 第五行文字 
- …… 
有序列表还有更多选项,如下图所示:

9、无序列表

大圆圈
- 第一行文字 
- 第二行文字 
- 第三行文字 
- 第四行文字 
- 第五行文字 
- …… 
小方块
- 第一行文字 
- 第二行文字 
- 第三行文字 
- 第四行文字 
- 第五行文字 
- …… 
无序列表还有更多选项,如下图所示:

10、居左对齐

所有内容默认都是居左显示。
10、居中对齐

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
11、居右对齐

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
12、标题2(h2)——标题6(h6)

为什么不用标题1(h1)?
文章标题默认使用的h1标签,因此在文章内容中不建议再插入标题1(h1),
标题2(h2)显示效果
标题3(h3)显示效果
标题3(h3)在文章中的应用频率最高,本文中就大量的使用了标题3(h3)。
标题4(h4)显示效果
标题5(h5)显示效果
标题6(h6)显示效果
13、字体

宋体:燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
微软雅黑:燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
微软雅黑是在网页中应用最多的字体。
楷体:燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
黑体:燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
隶书:燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
还有其他英文字体选项,但是中文网站一般用不到,不再一一演示。
14、字号

啧啧!字号没什么好测试的。
15、表情

face
















default


















16、超链接

在编辑器中选中文字,再点击超链接按钮,设置以下选项:

带有超链接的文字:点击访问燕山网络科技官网
17、多图上传

在文章中插入图片:

18、涂鸦

哈哈,没想到用编辑器还能画画呢!
点击涂鸦按钮显示画板:

看看我画的:

19、视频

20、附件

支持上传几十种格式的文件,以下仅添加几种常用的文件格式用作演示!
.rar
.zip
.txt格式
.doc格式
.docx格式
.ppt格式
.xsl格式
.xlsx格式
21、特殊字符

点击特殊字符按钮,可以选择特殊字符插入到编辑器中。

22、百度地图

在文章中插入百度地图,可以指定显示的位置。
在文章中插入代码语言,支持33种代码语言。
在文章中插入html代码语言演示效果:
24、引用

燕雀UI是一款基于jQuery+ HTML5+CSS3开发的前端框架。
25、表格

这是一个完整的表格
| 序号 | 标题 | 介绍 | 
|---|---|---|
| 1 | 项目名称 | 这是一段项目介绍的文字 | 
| 2 | 项目名称 | 这是一段项目介绍的文字 | 
| 3 | 项目名称 | 这是一段项目介绍的文字 | 
| 4 | 项目名称 | 这是一段项目介绍的文字 | 
26、分割线

以上的横线就是分割线!
【本文完】









