CSS常见属性（上）

• 块级元素行内元素
  • 块级可以包含块级和行内元素，行内只能包含文本和行内元素
  • 块级元素占据一整行的空间，行内元素占据自身宽度空间
  • 宽高设置、内外边距
  • 块级元素：div hi p hr form ul pre table li dd dt tr td th
  • 行内元素：em strong span a br img button label input salect code script
• 宽高
  • 只对块级元素设置生效，对行内元素无效
• 边框
  • 宽度，颜色，style
  • 使用边框做三角形
• 边距
  • margin：代表外边距，有着四个方向的值，可以合写，值可以是数值也可以是百分比（父容器，不是自身），可以是负值；对于行内元素，只对左右margin生效
  • border
  • padding：代表内边距，有着四个方向的值，可以合写，值可以是数值也可以是百分比（相对于父容器、不是自身）
  • 块级元素居中：margin: 0 auto
  • *{}：代表页面上的所有元素

CSS常见属性（中）

• display：
  • 块级：block，list-item, table
  • 行内：inline, inline-table, inline-block
• font：
  • font-size：字体大小
  • font-family：字体，宋体，微软雅黑，arial等，字体优先级；使用浏览器打开页面时，浏览器会读取HTML文件进行解析渲染。当读到文字是会转换成对应的unicode码。再根据HTML理设置的font-family去查找电脑里对应的字体文件；保险起见将字体名称用unicode来表示；escape(‘黑体’)
  • font-weight：文字粗度，常用的就是默认值regular和粗体bold
  • line-height：行高，可以用百分比、倍数
  • chrome最小默认字体是16px
• 文本
  • text-align：justify-两端对齐但是对最后一行不生效
  • text-indent：
  • text-decoration
  • color：
  • text-transform：
  • word-spacing：
  • letter-spacing：
• 行内元素居中：center
• overflow：hidden；text-overflow：ellipsis
• 颜色：单词；十六进制；rgb；rgba
• 单位：px；百分比；em（相对单位，相对于父元素字体大小）；rem（相对单位，相较于跟元素字体大小）；
• 其他
  • a链接设置颜色：a有默认颜色和样式，会覆盖继承的样式；需要单独定位到a
  • 列表去掉点：list-style: none;
  • 隐藏or透明：
    • opacity：0；整体
    • visibility：消失；位置还在
    • display：none，消失，不占位置
    • background-color：（0，0，0，0.2）