html与css部分
{
background-image: url(图片地址);
background-attachment: fixed;
background-repeat: no-repeat;
background-size: cover;
}
图片自动适应div大小css background-size:contain;css中设置背景图片 不重复 拉伸填充块空间
@font-face{
font-family:Didot;
src:url(xxxx\xxx.tff);
}
text-shadow制作文字阴影 效果多样可叠加
完成上方float部分的分栏后要通过clear:both清除浮动
background-color :rgba模式,加入了alpha通道,可调透明度,取值范围0-1
position:absolute 绝对定位,实现时间条在左侧的固定
z-index,图层顺序,越高越上层
border-radius 设置圆角边框
css绘制三角形
.content_item_icon_arrow{
position: absolute;
left:-15px;
top:20px;
height: 0px;
border-color: transparent azure transparent transparent;
border-width: 10px 10px 10px 0px;
/*0px的边框方向即三角形朝向*/
border-style: solid;
}
通过设置等长的width,height,border-radius来绘制圆形
overflow时隐藏滚动条 chrome safari适用 .element::-webkit-scrollbar {display:none}
css3中的filter滤镜属性很强悍,可以做出不少有意思的东西出来
css3新增audio标签,通过js使用pause()等方法对音频进行操控
关于z-index:给元素设置z-index样式,必须先让它变成定位元素,说的明白一点,就是要给元素设置一个postion:relative(定位元素:position属性值设置除默认值static以外的元素,包括relative,absolute,fixed)样式。不要给想控制“上、下”的元素设置z-index,而是对他们的父容器设置z-index样式。