1–清楚浮动的5种方法
1.伪对象法
.clearfloat:after{
content:"";
display:block;
clear:both;
height:0;
overflow:hidden;
}
.clearfloat{
zoom:1;
}
2.父元素加clear:both;
3.父元素加overflow:hidden;
4.空div法 ----浮动元素的后面,加一个
5.父元素加height(父元素高已知)
2–禁止页面缩放
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1">
3–设置一个视频无限播放,显示即播放,静音播放
无限:loop
自动播放:autoplay
静音:muted
<video src="" loop autoplay muted></video>
4–画一个三角形
.boxboss{
width: 0;
height: 0;
border-width: 100px;
border-style: solid;
border-color: transparent #0099CC transparent transparent;
}
<div class="boxboss"></div>
5–标准盒模型和怪异盒模型
box-sizing: content-box 是标准盒子模型,只包含内容的宽度
box-sizing: border-box 是IE盒子模型,会加上边框的宽度,算整体
6–遍历一个div的父节点下的所有子节点
var div=document.getElementsByTagName("div").parentNode.children;
7–创建一个属性,元素,文本节点
document.createAttribute();//属性
document.createElement();//元素
document.createTextNode();//文本
8–返回一个元素的宽度,高度,水平偏移,垂直偏移(包括边框border和填充padding,但不是边距margin)
offsetWidth //宽度
offsetHeight //高度
offsetLeft //水平偏移
offsetTop//垂直偏移
9–打开窗口 关闭窗口 移动窗口
window.open() - 打开新窗口
window.close() - 关闭当前窗口
window.moveTo() - 移动当前窗口
10–设置渐变,red-green
background-image:linear-gradient(red,green);//线性渐变(红色到绿色,从左到右)
background-image:radial-gradient(red,green);//径向渐变(红色到绿色,从里到外)
11–隐藏一个元素的3种方法,以及特点
display:none; 不占位置
visibility:hidden;占位置
opacity:0; 占位置