资讯专栏INFORMATION COLUMN

css文本属性用法总结

masturbator / 3350人阅读

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

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

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

 

文本修饰

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

4个属性值

overline   line-through   underline  blink

(1)overline

定义文本上的一条横线

(2)line-through

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

(3)一般标签会带由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

文本两端对齐

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1927.html

相关文章

  • CSS属性用法总结

    摘要:轮廓不被视为页面的一部分,因此在应用它们时不会导致页面布局被调整。 1.background系列属性 在为元素设定样式的时候,往往需要为该元素设置背景,一般有颜色,背景图片等. 1.1 背景颜色 在CSS类中使用background-color属性为元素设置背景颜色: /* CSS */ .box { width: 200px; heig...

    soasme 评论0 收藏0
  • 自适应宽度元素单行文本省略用法探究

    摘要:单行文本省略和元素及其父元素的属性都无关元素或为元素内单行文本省略,需要给元素或为元素添加样式为元素的子元素如果是自适应宽度时,内的子元素实现单行文本省略,需要给添加样式单行文本省略是现代网页设计中非常常用的技术,几乎每个站点都会用到。单行文本省略适用于显示摘要信息的场景,如列表标题、文章摘要等。在响应式开发中,自适应宽度元素单行文本省略容易失效不起作用,对网页开发这造成困扰。因此,本文将要...

    K_B_Z 评论0 收藏0
  • CSS开发

    摘要:译十六进制颜色揭秘原文地址原文作者译文出自掘金翻译计划本文永久链接教程入门篇关于是一款进行栅格布局的辅助工具,它让开发者摆脱了冗杂的数学计算,同时降低了样式与结构的耦合程度。 【译】CSS 十六进制颜色揭秘 原文地址:CSS Hex Colors Demystified 原文作者:Dave Gash 译文出自:掘金翻译计划 本文永久链接:https://github.com/xitu/...

    warkiz 评论0 收藏0
  • 补习前端(css+html)基础-1:

    摘要:标签将表单内容的一部分打包,生成一组相关表单的字段。提示和注释注释元素是空元素,它仅包含属性。注释此元素只能存在于部分,不过它可出现任何次数。属性属性规定当前文档与被链接文档之间的关系。该标签用于组合表格的主体内容。 1.HTML 标签: 实例 组合表单中的相关元素: health information height: weight: 定义和用法 fieldset 元素...

    marek 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<