CSS---Tips1文本样式
2016-07-08 15:20
561 查看
字体样式
font-variant
设置字体是否以小型大写字母显示。p{ font-variant: small-caps; /* 让小写字母以小型大写字母显示。*/ }
font
字体设置简写组合方式。格式如下:[是否倾斜|是否加粗|是否转小型大写] 字体大小 字体名称;p{ font: bold italic 20px 楷体; }
![](http://7xvk9f.com1.z0.glb.clouddn.com/QQ%E6%88%AA%E5%9B%BE20160707175840.png)
文本样式
text-decoration
设置文本出现下划线- underline 让文本的底部出现一条下划线
- overline 让文本的头部出现一条上划线
- line-through 让文本的中部出现一条删除划线
.p1 { text-decoration: underline; } .p2{ text-decoration: line-through; } .p3{ text-decoration: overline; }
![](http://7xvk9f.com1.z0.glb.clouddn.com/QQ%E6%88%AA%E5%9B%BE20160708151145.png)
text-transform
设置英文文本转换为大小写- capitalize 将英文单词首字母大写
letter-spacing
设置文本之间的间距。.p1 { letter-spacing: 6px; }
word-spacing
设置英文单子之间的间距。.p2{ word-spacing: 6px; }
text-indent
设置文本首行的缩进。p { text-indent: 2em; }
![](http://7xvk9f.com1.z0.glb.clouddn.com/QQ%E6%88%AA%E5%9B%BE20160708151527.png)
white-space
设置如何处理元素内的空白-nowrap 文本不会换行,文本会在在同一行上继续,直到遇到
<br>标签为止。
![](http://7xvk9f.com1.z0.glb.clouddn.com/QQ%E6%88%AA%E5%9B%BE20160708165138.png)
text-overflow
text-overflow 属性来控制文本的溢出部分,它的作用是对溢出的部分裁剪掉,然后判定是否添加省略号。clip 默认值,裁剪文本时不添加“…”省略号
ellipsis 裁剪文本时添加“…”省略号
![](http://7xvk9f.com1.z0.glb.clouddn.com/QQ%E6%88%AA%E5%9B%BE20160708170349.png)
相关文章推荐
- Web布局连载——两栏固定布局(五)
- [div+css]晒晒最新制作专题推广页模板
- 盒子模型
- CSS选择器
- CSS样式优先权
- [css] line-height 百分比单位和数值单位的区别
- Apple官网研究之使用Justify布局导航
- 关于前端的思考与感悟
- rem : web app适配的秘密武器
- jquery高级应用之Deferred对象
- 移动端点击事件全攻略,这里的坑你知多少?
- $q 实例分析 Angular 中的 Promise
- 浏览器中唤起native app || 跳转到应用商城下载
- Angular directive 实例详解
- 关于浮动与清除浮动,你应该知道的
- 设计更快的网页(三):字体和 CSS 调整
- 纯CSS制作的新闻网站中的文章列表
- 10条影响CSS渲染速度的写法与使用建议第1/3页