首页 > css教程 > 正文

css文本属性有哪些?css文本属性的总结

原创 2018-08-13 09:42:32 0 45
赞助会员专享特权
本篇文章给大家带来的内容是关于css文本属性有哪些?css文本属性的总结,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

稍稍总结了下css文本的一些属性用法,自己忘记的时候也可以用来查查,不用去查网站那么麻烦。

下面是部分总结,也希望对其他人有用

文本修饰

(1)text-decoration: 文本修饰(横线)

4个属性值

overline line-through underline blink

(1)overline

定义文本上的一条横线

(2)line-through

这个属性值时最有用的,一般商家降价促销后面的价格会用横线划去表示那是之前的价格

(3)一般<a>标签会带由unline

要想去除就要设置text-decoration:none

(4)blink

文本闪烁,一般很少使用,只有在canvas中会使用,并且浏览器的支持度不高,只有火狐支持

另外:

还可以用text-decoration-color来修饰横线的颜色

(2)text-transform 字母大小写

5个属性值

capitalize uppercase lowercase inhert none

(1)capitalize

首字母大写

(2)uppercase和lowercase

大小写

(3)inhert

继承父元素的字母属性

(4)none

默认,没有任何效果

(3)text-overflow 定义文本超出范围的修饰

3个属性

clip ellipsis string

(1)clip

修剪文本

(2)ellipsis

用省略号来表示超出的文本

(3)string

用固定的字符来表示超出的文本

(4) text-shadow: h-shadow v-shadow blur color 文本阴影效果

3个属性值

(1)v-shadow 必需,水平阴影的位置,允许负值

(2)v-shadow 必需,垂直阴影的位置,允许负值

(3)blur 可选,模糊的距离

(4)color 可选,阴影的颜色

文本布局

(1)text-indent 文本缩进

3种属性值

length % inhert

(1)length

定义固定缩进,以像素为单位,默认值为0

(2)%

以父元素宽度的百分比为长度缩进

(3)inhert

继承父元素的缩进

(2)text-align 文本对齐

5种属性值

left center right justify inhert

(1)left和right

很少使用

(2)center

居中对齐

经常和line-height:父元素高度 一起使用使文本居中对齐

如果不添加line-height 属性,文本会偏在父元素的上方

(3)justify

文本两端对齐

相关推荐:

用CSS动态控制文本属性_CSS/HTML

css中文本换行属性word-wrap和white-space

以上就是css文本属性有哪些?css文本属性的总结的详细内容,更多请关注php中文网其它相关文章!

  • 相关标签:css文本属性
  • 本文原创发布php中文网 ,转载请注明出处,感谢您的尊重!
  • 相关文章


  • 实例详解css3特效之3D翻牌效果
  • 深入理解form表单中Readonly和Disabled的区别
  • 如何用CSS3和Js制作响应式导航条
  • 实例详解CSS3制作文字流光渐变特效
  • css文本属性有哪些?css文本属性的总结
  • 网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
    独孤九贱(4)_PHP视频教程

    独孤九贱(4)_PHP视频教程

    江湖传言:PHP是世界上最好的编程语言。真的是这样吗?这个梗究竟是从哪来的?学会本课程,你就会明白了。 PHP中文网出品的PHP入门系统教学视频,完全从初学者的角度出发,绝不玩虚的,一切以实用、有用...

    独孤九贱(5)_ThinkPHP5视频教程

    独孤九贱(5)_ThinkPHP5视频教程

    ThinkPHP是国内最流行的中文PHP开发框架,也是您Web项目的最佳选择。《php.cn独孤九贱(5)-ThinkPHP5视频教程》课程以ThinkPHP5最新版本为例,从最基本的框架常识开始,将...

    独孤九贱(1)_HTML5视频教程

    独孤九贱(1)_HTML5视频教程

    《php.cn原创html5视频教程》课程特色:php中文网原创幽默段子系列课程,以恶搞,段子为主题风格的php视频教程!轻松的教学风格,简短的教学模式,让同学们在不知不觉中,学会了HTML知识。 ...

    ThinkPHP5实战之[教学管理系统]

    ThinkPHP5实战之[教学管理系统]

    本套教程,以一个真实的学校教学管理系统为案例,手把手教会您如何在一张白纸上,从零开始,一步一步的用ThinkPHP5框架快速开发出一个商业项目。

    PHP入门视频教程之一周学会PHP

    PHP入门视频教程之一周学会PHP

    所有计算机语言的学习都要从基础开始,《PHP入门视频教程之一周学会PHP》不仅是PHP的基础部分更主要的是PHP语言的核心技术,是学习PHP必须掌握的内容,任何PHP项目的实现都离不开这部分的内容,通...

    相关视频教程

  • javascript初级视频教程 javascript初级视频教程
  • jquery 基础视频教程 jquery 基础视频教程
  • javascript三级联动视频教程 javascript三级联动视频教程
  • 独孤九贱(3)_JavaScript视频教程 独孤九贱(3)_JavaScript视频教程
  • 独孤九贱(6)_jQuery视频教程 独孤九贱(6)_jQuery视频教程
  • 相关视频章节