HTML CSS 属性

  （1）HTML：(Hyper Text Markup Language)是一种规范和标准，用于实现静态的直观的用户浏览页面。

 （2）表格的创建：表格用于信息的输出显示，在HTML用<table>标签定义，常见的标签有：<tr> <th> <td> <colspan> <rowspan>.tr元素定义表格行，th元素定义表头，td元素定义表格单元,用rowspan colspan来合并单元格，用align valign 来表示对齐方式。 表格有width height background bordercolor 属性

（3）块级元素和行级元素的区别：块级元素一般都从新行开始(div ul li dl dt dd h1-h6 p)，行级元素用在文本之中的某一行的修饰（a span strong sub sup img）;块级元素是盒子，本身是有宽高的，行级元素是袋子，其宽高是靠你面的东西撑起来的。

（4）<img>标签添加图片，可以从本地文档添加，也可以设置相对地址（网上图片地址）有ait 和 title属性 。alt：表示图片不能正常显示时，出现的内容； title：表示对图片的描述。设置两个a标签时，可以达到描点链接的功能。<a name ="c" ></a>(跳转位置)  <a here="#c"></a>点击位置

（5）块级元素转换为行级元素：display:inline; 行级元素转化为块级元素：display block;

(6) CSS: (Cascading  Style  Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。

(7)在css中 width 和 height 指的是内容区域的宽度和高度。增加内边距（padding）和外边距（margin）以及边框（border）不会影响内容区域的大小，但是会增加元素框的总尺寸。相邻元素的左右外边距会相加，上下外边距会发生合并，显示大边距的那一个外边距。

设定一个块元素居中：margin：0 auto；

（8）元素定位课分为相对定位（position：relative） 绝对定位（position：absolute） 固定定位（position：fixed），默认为static，也就是说没有定位属性。绝对定位和固定定位都会脱离标准文档流。位置都通过z-index left right top bottom 来移动.z-index的值越大，显示在最上边。

（9）相对定位参照元素本来的位置进行偏移，原本的空间会保留，移动时会覆盖其他元素；绝对定位相对于离它最近的有定位属性的父级元素进行定位，原本的位置不会保留；固定定位是相对于浏览器的窗口进行定位。设置浮动与清除浮动一定要同时存在。

（10）css背景：background-color（背景颜色） background-img（背景图片） background-repeat（背景图片重复属性，一般默认为no-reapeat） background-positon（背景定位）；

（11）css文本属性： text-family（文本样式） text-size（文本大小）  color（颜色） text-decoration（文本修饰，属性值：underline none等） text-indent(文本第一行的间距  text-indent:2em）text-align（文本摆放位置，属性值：cente等）

（12）css链接：a:link(没访问过a标签的颜色) a:visited （访问之后a标签的颜色） a:hover （鼠标放在a标签上显示的颜色） a:active（点击a标签时的颜色）；照这个顺序能够实现css效果 。

（13）css框：border（可设置颜色 实线 及颜色）

（14）文字剪切以及隐藏：text-overflow:clip（直接剪切）/ellipsis(剪切的部分用省略号表示)，要实现这个功能时，必须与white-space:nowrap（强制一行）及overflow:hidden（超出部分隐藏）这两条一起使用。

（15）text-shadow：设置文本的阴影效果。  color表示阴影颜色；   Blur表示阴影模糊程度；eg：text-shadow{x，y，Blur，color}。如果要设置立体文字，就应该设置多组值，中间用逗号隔开。

（16） border-radius：设值边框圆角；档宽高一样时，设值为50%会变成原型；宽高不一样时，设值为50%会变成椭圆；要设置盒子立体也可以用boeder-shadow，属性及属性值和立体文字一样。设置立体时，visibility：hidden:元素会隐藏，原本的位置会保留；diaplay：none：元素也会隐藏，但是原本的位置不会被保留。

（17）渐变：线性渐变与径向渐变。线性渐变：linear-gradient（）；必要元素：方向，起始色，终止色。to top left：右下角到左上角；默认的是从上到下；径向渐变分为圆形渐变（宽高一样）和椭圆形渐变（宽高不同）。圆形渐变：radial-gradient（circle，color）；椭圆形渐变：radial-gradient（ellipse，color）；

（18）2D转换分为变形-扭曲、旋转、缩放、位移。它们四个都要分x轴y轴方向的变换。

变形-扭曲：transform：skey（x，y）与x轴y轴倾斜的角度；旋转：transform：rotate（   deg）旋转了多少度，单位用deg表示；缩放：transform：scale（x，y）与x y轴倍数；位移：transform：translate（）原始位置开始移动，单位px，分x轴 y 轴，原本的卫士会保留；

（19）动画：animation-name（动画名称） duration（持续时间） delay（延迟时间） 通过@keyframes结点指定动画的序列。eg：div{ width:""; height:""; animation:animation-name，duration，delay，infinite（无限循环）}

结点必须包含开始和结束；animation-timing-function（执行速度）  animation-direction（可设置逆向播放 奇数次顺波，偶数次逆播）