css common style (font-style, text-decoration, line-height ...)

color

     (1)定义:元素内部元素的文字颜色

     (2)预设值:  定义好的单词 、三原色,色值 光学三原色(红,绿,蓝),每个颜色可以使用0-255之间的数字来表达

            rgb表示法:  rgb(255,255,255)   


            hex(16进制)表示法:  #红黄蓝(每两位)

                  淘宝红:#ff4400 #f40
                  黑色:#000000  #000
                  白色:#ff0000  #f00
                  红:#00ff00 #0f0
                  蓝:#0000ff #00f
                  紫:#ff00ff #f0f
                  青:#00ffff #0ff
                  黄:#ffff00 #ff0
                  灰:#cccccc #ccc

backgroung-color

   (1)定义:元素的背景颜色        //  属性值跟color类似

font-size

   (1)定义:字的尺寸大小

   (2)单位:> 像素(px), 绝对单位
            > 相对单位:  相对于父元素的字体大小
                         每个元素必须有字体大小,如果没有申明,则直接使用父元素字体大小,则使用基准字体大小

font-weight

   (1) 定义:文字粗细程度,可以取值数字(10px),也可以取值为预设值(bold normal)

   (2) user agent stylesheet,用户代理样式 (因为是浏览器解释出来的,所以也叫浏览器默认样式)

font-family

  (1) 定位:文字类型

  (2)必须用户计算机存在的字体才会有效,
     可以使用多个字体,以匹配不同环境(最后加上sans-serif,非衬性字体[边缘没有修饰])

font-style

  (1)定义:字体样式,通常用它来设置斜体

  (2)i元素,em元素,默认样式是斜体字体;实际使用中,通常用它表示一个图标
          strong元素,表示重要的,不能忽视的内容
          em元素,表示强调的内容

text-decoration

 (1)定义:文本修饰,给文本加线

 (2)line-through 横线穿过, over-line 上面加横线,under-line 下面加线
         a元素:超连接 ,    del:错误的内容 ,      s元素:过期的 
         a元素的下划线 ,del、s元素的横穿线都可以在作者样式覆盖浏览器默认样式

text-indent

(1)定义:首行文本缩进

(2)单位:像素(px),表示缩进的距离  em,缩进文字个数

line-height

(1)定义:每行文本的高度,该值越大,每行文本的距离越大

(2)应用:
               <1>设置行高为容器的高度,可以让单行文本垂直居中 [单行文本]
               <2>行高可以设置为纯数字,表示相对当前元素的字体大小 [多行文本]

width 、height

 (1)定义:分别盒子的宽度和盒子的高度

   (2) 单位 :像素(px),表示缩进的距离  em; 百分比(相对于父元素)

letter-space、text-align、vertical-align

 (1)定义:分别为文字间隙、文本元素内部文字的水平排列方式、文本元素内部文字的垂直排列方式

line-height

(1) Definition: line-height attribute for setting the distance between lines (line height), such as text. For block-level element, it specifies the minimum height of the frame elements, for not replaced inline element, it does not affect the line-height, such as a button or other input element.

          (原文未提到,对于部分替代元素,line-height依然可,  以影响元素的样式布局)

(2) Unit:

  • px, multi-line text pixel value [set a fixed spacing value would be difficult to control]
  • No units of the first digital [digital inheritance, and then calculate]
  • em units [multi-line text set em units it is difficult to control the font line height, because it is the first em calculated as the pixel value (16px default value basis), then inherited]
  • [Percentage] problems like em
Published 20 original articles · won praise 1 · views 54

Guess you like

Origin blog.csdn.net/weixin_43388615/article/details/105081700