CSS基本属性

Css基本属性

• 宽高 , 宽高对块级元素与行内元素作用范围不同。

  
  
  1.PNG

块级元素 vs 行内元素

• 块级元素
  1，blockline-level
  2，块级元素包含块级与行内
  3，块级元素占据一整行的空间。
  块级元素包括
  div,h1-h6,form,ul,ol,dl,pre,table,li,dd,dt,tr,td,th

• 行内元素
  1，内联，Inline-level
  2，只包含文本与行内
  3，占据自身宽高与空间
  行内元素包括
  em,strong,span,a,br,img,button,input,label,select,textarea,code,script

• 边框

  
  
  2.PNG

• 利用边框作图形

  
  
  1.PNG

• 边距

1. Padding :
   代表内边距，有四个不同方向的值，可以合写，值可以是数值，也可以是百分比。
   • padding-top
   • padding-left
   • padding-right
   • padding-bottom
     以上为padding合写时的顺序，上-右-下-左。

2. margin
   代表外边据，有四个方向的值，可以合写，值可是数值，也可以是百分比。相对父容器，不是自身。还可
   以是负值。
   • margin-top
   • margin-left
   • margin-right
   • margin-bottom

4.PNG

3. Font ,字体。

• font - size: 字体大小
• font - family :字体样式，默认为regular粗体bold
• font - weight :字体粗细
• line - height :行高，可以是百分比，也可以是倍数或固定尺寸
  ★关于立体属性设置说明
  用过ps，美图秀秀的胖又们都知道，如果你想要在做一个好看的字体，一定要先下载文字包，或者给电脑添加字体压缩包等，否则设置了也没有效果，这里的font 字体效果也是一个道理，如果你想要好看的样式，或者是想要设置自己新水的样式，不仅仅要设置，最基础是你电脑里要有这个文字元素文件。否则，都白搭！

★Font- family的写法
在css设置字体时，直接写中文或英文名称时，浏览器通过Gb，UTF-8，匹配编码时，如果匹配不上则会出现乱码，所以最好的方式是将字体名称用unicode表示。
例如’宋体|SimSun \5b8b\4s53 黑体 \SimHei | \9EDI | \4F53 微软雅黑
Micosoft YaHei | \5FAE \8F6F \96C5 \ 9ED1

字体转换方法‘
打开控制平台 eacape('微软雅黑')，把%u换成

1.PNG