mouseenter和mouseover的区别 .father, .father2 { display: inline-block; width: 200px; height: 100px; background-color: pink; } .son, .son2 { width: 100px; height: 50px; background-color: skyblue; } .father2 { b...

元素滚动scroll系列 .test_box { padding: 10px; width: 200px; height: 100px; background-color: pink; border: 10px solid red; /* 显示滚动条 */ overflow: auto; } 元素滚动scroll系列# 元素scroll系列属性# s...

元素可视区client系列 .test_box { padding: 10px; width: 200px; height: 100px; background-color: pink; border: 10px solid red; } 元素可视区client系列# client 即客户端，使用client系列的相关属性来获取元素可视区的相关信息。通过client系列的相关属性可以动态的得到元素的边框大小、元素大小等。 ...

广义的HTML5_CSS3 广义的HTML5_CSS3# 狭义的# HTML5结构标签本身+CSS3相关样式 广义的HTML5# 广义的HTML5是HTML5本身+CSS3+JavaScript 这个集合有时称为HTML5和朋友，通常缩写为HTML5 虽然HTML5的一些特性仍然不被某些浏览器支持，但它是一种发展趋势 HTML5 MDN介绍 ...

CSS3过渡 .tran { width: 200px; height: 100px; background-color: pink; /* transition: 变化的属性 花费时间 运动曲线 何时开始; */ /* transition: width 1s linear .3s, height 1s linear .3s; */ transition: all 1s 0.5s; } .tran:hover { width: 400px; height: 200px; backgrou...

CSS3其他特性 .div3 img { float: left; width: 33%; padding: 10px; } .div3 img:nth-of-type(2) { /* blur是一个函数，小括号里面的数值越大，图片越模糊，数值带单位 */ filter: blur(5px); } .div3 img:nth-of-type(2):hover, .div3 img:nth-of-type(3):hover { filter: blur(0); } ...

CSS3盒子模型 .cool { width: 200px; height: 200px; padding: 20px; margin: 10px; border: 20px solid red; background-color: pink; } .pre { float: left; box-sizing: content-box; } .next { float: left; box-sizing: b...

CSS3伪元素选择器 @font-face { font-family: 'icomoon'; src: url('/globalsrc/fonts/icomoon/icomoon.eot?33ik8w'); src: url('/globalsrc/fonts/icomoon/icomoon.eot?33ik8w#iefix') format('embedded-opentype'), url('/globalsrc/fonts/icomoon/icomoon.ttf?33ik8w') format('truetype'), url('/globalsrc/fonts/icomoon/icomoon.woff?33ik8w') format('woff'), url('/globals...

CSS3结构伪类选择器 .ul li:first-child { background-color: pink; } .ul li:last-child { background-color: grey; } .ul li:nth-child(2) { background-color: skyblue; } .ul li:nth-child(even) { color: red; } .ul li:nth-child(odd) { font-weight: bold...

CSS3属性选择器 /* 1.必须是input，且同时具有value这个属性[] */ input[value] { color: red; } /* 2.只选择type=password的文本框 */ input[type='password'] { color: green; } /* 选取以icon开头的选择器的div */ div[class^='icon'] { color: blue; } /* 选取以data结尾的选择器的section */ section[class...