HTML 基础知识

• 单位：
  px em rem
  em：相对于父容器的倍数大小。用的较少。
  rem：相对于根节点的，属于相对单位。移动端用的较多。

• 文本位置：
  text-align:left/right/center/justify;
  justify:文字满了，左右对齐排版，显的美观。

• font-weight:bold; 粗体

• border-radius: 4px; 圆角

• id 选择器具有唯一属性。
• class选择器不是唯一属性。
• font-style:italic;/*斜体，normal*/
• line-height: 1.5; 文本高度的倍数 /*line-height=heiht的高度的时候 垂直居中*/

行高的深入理解参考资料

• word-wrap:break-word; 以单词为单位进行强制折行
• <a href="#">风骨来客</a>正常未访问的是蓝色，访问过的是紫色
  text-decoration:none;去掉下划线
  transition:color 0.3s; 颜色渐变效果

a的一个伪类元素
target=“_blank”;新开窗口
a:hover {
color:red;
}
a：active/鼠标点下去没有松开/ {
background:blue;
}

此伪类元素在IE8以上都能使用，不单单只对<a></a>有效

• 跳转到锚点
  <a href="#md" target="_blank"></a>

<p id="md">锚点</p>

• css 伪类，次序不能放反

a:link{color:#ff0;} /* 未访问的链接 /
a:visited{color:#f00;} / 已经访问的链接 /
a:hover{color:#00f;} / 鼠标悬停的链接 /
a:active{color:#0ff;} / 鼠标点中没有松开的，已经选中的链接 */

• 表格table

border-collapse:collapse; 表格之间没有间隙

• display:table-cell; 定义特性有表格的特性，如右图的DIV1 具备表格特性。常用的垂直居中方法。IE8一级以上才能适用。

7F7CEFBA-BC58-4D97-9F21-2E69C11D48CB.png

• display:none; 脱离文档流，隐藏掉，下面的东西会自动顶上来。
  相对的 visibility:hidden;用户看不见，实际上是透明的。
  opacity:0;透明度为0.

本文章著作权归（风骨来客qq:2361597776）和饥人谷(QQ 群: 222459918) 所有，转载须说明来源