不太常用的属性：
text-decoration : underline; 下划线，text-decoration : line-through; 删除线 ， font-style : normal; 去掉斜体
text-align：justify；将文本两端对齐边框，border : 1px dashed #000; dashed虚线 dotted点线
list-style-image：url ( “图片地址”) ; li样式加图片
cursor : wait 鼠标加载样式 url ( 可添加图片) box-shadow的：
box-shadow : h-shadow v-shadow blur spread color inset; 横向和纵向都设置为0 为四边都有阴影（竖向偏移，横向偏移，模糊程度，大小，颜色，内外）
box-shadow : 0 0 0 #ffedd0 inset, 0 0 0 #ffedd0 inset, 0 -10px 10px #ffedd0 inset, 0 10px 10px #ffedd0 inset;
text-shadow : 2px 0px 0px #000, -2px 0px 0px #000, 0px 2px 0px #000, 0px -2px 0px #000; 文字描边
-webkit-text-stroke : 2px red; css3文字描边
text-shadow : 5px 5px 5px #e5829a; 文字阴影 X Y 模糊程度 颜色
// 当一个块元素里包含多个行内元素 字体之间出现间距【使用font-size：0】解决
position：static 定位 默认值 ；
CSS3动画的点：
transition : all 2s linear 1s; 最后一个是等待时间 cubic-bezier ( 1, 4, 1, 1) 这是第三个参数 设置动画方式
border-radius : 300px 300px 300px 300px/300px 300px 300px 300px; border-radius八值大乘期
// border-radius : 左上角水平圆角半径大小 /右上角水平圆角半径大小 /右下角水平圆角半径大小 /( 左下角水平圆角半径大小/左上角垂直圆角半径大小) /右上角垂直圆角半径大小 /右下角垂直圆角半径大小 /左下角垂直圆角半径大小;
transform-style ：preserve-3d
css3：旋转：rotate ( ) 扭曲：skew ( 30deg, 20deg) 缩放：scale ( 2, 4) 移动：translate ( )
所有的2D转换方法组合在一起： matrix ( ) matrix ( scale.x , , , scale.y , translate.x, translate.y)
综合起来使用：transform : 30deg 1.5 30deg 20deg 100px 200px;
@media 响应式一定要在and 和 （min-width：1400px） 中间加空格 妈的坑死老子了
控制文字行数：
white-space : nowrap; overflow : hidden; text-overflow : ellipsis; 超出的文字显示省略号
overflow : hidden; text-overflow : ellipsis; -webkit-line-clamp : 2; -webkit-box-orient : vertical; display : -webkit-box; 必须加这个 三种写法 flex迭代 超出几行显示省略号......
white-space : pre-wrap; word-break : break-all; 强制换行 white-space : nowrap; 强制不换行
CSS3的一些冷知识：
filter : blur ( 9px) ; css3模糊程度
backface-visibility : hidden; 图片转过去后隐藏，百度钱包的效果
border-image : url ( ../../../img/border.png) ; // 后面参数为srretch的时候表示边框图片拉伸填充 为round的时候规格的铺满整个区域
// 边框图片：1.路径 2.边框向内偏移属性 可以是四个值 也可以两个 3.三个值 一个是重复repeat 一个平铺round 一个填充 st 什么东西
background : #000 url ( 1.jpg) ; background属性简写
-webkit-box-reflect : below 10px -webkit-linear-gradient ( top, rgba ( 250, 250, 250, 0) , rgba ( 250, 250, 250, 0) 20%, rgba ( 250, 250, 250, 1) ) ; 倒影
// css3倒影必须加前缀：第一个值是倒影方向 above上below下 左右属性不变（需要给倒影留一个空白区域）， 第二个值是与原图间隔距离，第三个值是遮罩效果 可以背景图片也可以是渐变生成的透明图像
-webkit-text-stroke : 2px red; css文字描边 -webkit-text-fill-color : transparent; 两个配合在一起用将形成镂空文字 ← 无意间发现强大的很呐
background-image : -webkit-linear-gradient ( #eee, #000) ; -webkit-background-clip : text; -webkit-text-fill-color : transparent; 渐变文字
column-count : 4; column-gap : 140px; column-rule : 20px solid #000; css3多列文本布局 // 简写：间距、样式、颜色
//> 第一个表示要分成几块 第二个表示每个块之间的间距 第三个表示在间距之间的样式 和border一样
"screen and (max-width:800px)" href="midia800.css" > 按media宽度引入css
first-letter first-line等伪类 必须是块元素||行内块元素
filter : brightness ( .5) ; 调整图片亮度 相当于盖个黑色背景框
mix-blend-mode : difference; 颜色差值 相当于正片叠底 具体上收藏夹看
L-V-H-A : a:link { } a:visited { } a:hover { } a:active { } 改变a链接访问过后的顺序
@medio 响应式如果是1366的分辨率 在写min-width{ } 写1400px
one.style.height=tu[0].offsetHeight+li[0].offsetHeight+"px" ; 原声一定要加px
text-transform ：css控制字母大小写 Capitalize 英文拼音的首字母大写 Uppercase 英文拼音字母全大写 Lowercase 英文拼音字母全小写
div::-webkit-scrollbar { display : none} pc和移动端隐藏scroll滚动条
// 伪元素里after里换行：\A--------------------------white-space : pre-wrap；和这个配合使用
@font-face { font-family : "自定义" ; src : url ( '/example/css3/Sansation_Light.ttf' ) , url ( '/example/css3/Sansation_Light.eot' ) ; } 引入css3字体
$( ".box" ) [0].style.setProperty ( "--y" , y) ；transform : rotate ( calc ( 20deg - 10deg * var ( --y) ) ) ; 必须var !!!css调用js变量的方法：
@keyframes：
animation : 6个属性（名字，时间，动画方式，延迟，次数，是否反向）aa 2s ease 1s infinite [alternate normal];
animation-fill-mode : both;
animation-fill-mode : forwards; 停留在最后一帧
animation-play-state : paused; 利用hover动画暂停 离开将从暂停位置继续播
js控制动画开始running both停留在动画中
jquery里需要这样写$( ".clip-p" ) .css ( "-webkit-animation-play-state" , "paused" ) ; 属性不用大写，直接 -
HTML5：
< progress> html5加载新属性 < meter> 进度条新属性
mouseenter 事件。对应mouseleave
< a href= "1.jpg" download= "下载之后的图片名字" > < img src= "1.jpg" alt= "W3School" > < / a>
$ ( ".content" ) . delegate ( ".div span" , "click" , function ( ) { } )
< a href= "tel:13546698741" > 电话< / a> 移动端直接拨打电话的
< p contenteditable= "true" > 这是一段可编辑的段落。请试着编辑该文本。< / p>
html+css乱七八糟的：
select { 去除下拉框默认样式 border : solid 1px #000; appearance : none; -moz-appearance : none; -webkit-appearance : none; }
background : url ( "http://ourjs.github.io/static/2015/arrow.png" ) calc ( 100% - .2rem) center/.5rem .5rem;
// *清除ie的默认选择框样式清除，隐藏下拉箭头
select::-ms-expand { display : none; }
user-select：none；禁止页面文字被选中
first-letter 在火狐下不支持￥符号 我擦 不能用了，慎用啊
vertical-align : text-top; 这个属性是给行元素设置垂直居中的，属性值较多 先在父元素上设置line-height 以免引起反作用
{ list-style-type : none; counter-reset : sectioncounter; }
// ol li:before { content : "美女" counter ( sectioncounter) "： " ; counter-increment : sectioncounter; }
\\ js改变after伪类问题，给元素加一个类名，类名里添加content attr
p:after { content : "111111111111111" ; }
p.change:after { content : attr ( aa) ; }
$( "p" ) .addClass ( 'change' ) .attr ( "aa" , "content111111111111" ) ;
// 另一种修改方法
var css=function(t,s) {
s=document.createElement ( 'style' ) ;
s.innerText=t;
document.body.appendChild ( s) ;
} ;
document.οnclick=function() {
css ( 'p:after{content:"5565442321"}' ) ;
\\ }
window.open ( "https://www.baidu.com/s?wd=" + val ) ; // 网站搜索功能
// 第三方登录实现：1 注册成为QQ互联平台开发者，http : //connect.qq.com/; 2 准备一个可访问的域名，如dev.foo.com; 3 创建网页应用，配置必要信息，其中包括域名以及回调地址；其中域名需要验证，需确保对域名主机有足够的控制权限; 4 获取应用appID、appKey进行开发;
// 360使用低版本兼容模式IE内核，加这两句转换为webkit"X-UA-Compatible" content="IE=edge" >
// "webkit" >
animate.css: 第三方动画库常用的几个类名，都要添加一个共同类名：animated
JavaScript：
window. getComputedStyle ( objs[ 0 ] , null ) . width,
getPropertyValue方法可以获取CSS 样式申明对象上的属性值（直接属性名称），例如：
window. getComputedStyle ( element, null ) . getPropertyValue ( "float" ) ;
event. stopImmediatePropagation ( ) ; 阻止事件捕获 dom3新出的
