小知识点

笔记本什么的太容易丢失而且一般写过了就很少翻翻，So放到这里,浏览方便，会经常看看。

1.多行文本域
textarea (上次很尴尬的记成input了)

---

2.font-size
默认是16px,
xx-small 9px
x-small 11px
small 13px
medium 16px
font-weight
100-500 不加粗
600-900 加粗

---

3.css 实现一个小三角
例如：i

i{    display:block;    width:0;    height:0;    border-style:solid;    border-width:5px;    border-color:#000 transparent transparent transparent ;

4.怎样让一个图片垂直居中
第一步：在一个div里包含一个img图片，让div里在包含一个span空标签让span的高度为100%
第二步：让span和img的display为inline-block，然后让span和img垂直居中

结构部分：<div>            <img src="images/img_03.jpg"/>            <span></span></div>样式部分：    div{            width:247px;            height:292px;            border:1px solid #333;            margin:30px auto;            text-align:center;        }        span,img{            display:inline-block;            vertical-align:middle;        }        span{            height:100%;        }        img{        }

样子如下：

5.属性前缀
” _ “, ” * “,” *+ “,” \0 “等。

” _ ” 只有Ie6,及IE6以下识别。

” * “,” *+ ” 只有Ie7,及IE7以下识别。

” \0 ” 针对Ie8

6.datalist 的用法

<input type="text" list="list" />        <datalist id="list">            <option value="宝马" label="汽车"></option>            <option value="奔驰" label="汽车"></option>            <option value="路虎" label="汽车"></option>            <option value="面包" label="food"></option>            <option value="可乐" label="food"></option>            <option value="爱情"label="food"></option>        </datalist>

效果如下：

7.form里的一些小技巧

required   必填选项placeholder  默认提示autofocus   自动获取焦点 autocomplete   是否自动获补全 novalidate   对表单不进行验证 

8.border-style:double 时至少有3px；
9.让一个元素恢复默认，width：auto； height:auto;

10.一个宽为300px的内容块，其内容为单行文本时内容居中，多行文本时左对齐。

结构：<div>    <p>我是文本内容我是文本内容我是文本内容我</p></div>样式：div{        text-align: center;        width: 150px;        background: hotpink;    }p{        display: inline-block;        text-align: left;    }