话不多说,直接进入主题----->
1、HTML5中新增的属性有哪些
h5中:header头部,nav导航,canvas定义图片,audio音频,video视频,footer页尾,section相当于div,dialog定义对话,time时间,figure图片/figcaption图片文字
input中:tel电话,emali邮件,number数字,color颜色,file文件选择框,search搜索框
form中:placeholder框里不输入东西会弹出提示 autofoucs自动获取焦点
2.css3新增属性
- border-radius:圆角
- box-shadow:阴影
- border-image:边框图片
- text-shadow:文字阴影
- transform translate位移 rotate旋转 scale缩放 skew转动时给定的角度 rotateX/rotateY/rotateZ:3D旋转属性
- box-sizing父级宽高不变,内容随便折腾
3.怎么制作小三角
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid red;
4.使用css,让一个div消失在视野中
- display: none;隐藏不占位
- visibility: hidden;隐藏占位
- opacity: 0;
- background-color:transparent;透明
- transform: scale(0);缩放
5.请列出你所知道的使用css让元素上下居中方案
1)文字居中
text-align:center
line-height=height
2)块级元素居中
1>先给父元素加一个定位属性,然后给子元素一个绝对定位,四个方向设置0,然后用margin居中
pisition:absolute;
top:0;
bottom:0;
left:0;
right:0;
margin:auto;
2>通过transform,让元素居中
position:absolute;
left:50%;
top:50%;
transform:transtlateY(-50%);
transform:transtlateX(-50%);
3>通过flex布局,
两种方法:
- 给父元素添加display:flex,子元素添加margin:auto;
- 父元素添加display:flex,justify-content:center,align-item:center,子元素不做任何处理
6.CSS中那个属性用来定位元素
- position
- static:默认值不脱离文档流
- relative:相对定位,不脱离文档流,结合四个方位相对于自己的左上角进行定位
- absolute:绝对定位,脱离文档流,结合四个值相对于离他最近的元素进行定位,注意:脱离文档流
- fixed:固定定位,脱离文档流,相对于可视窗口进行定位,出现滚动条也不会随之滚动
7.什么叫做标签语义化
- 有利于SEO,有利于搜索引擎爬虫更好的理解我们的网页,从而获取更多的有效信息,提升网页的权重。
- 在没有CSS的时候能够清晰的看出网页的结构,增强可读性。
- 便于团队开发和维护,语义化的HTML可以让开发者更容易的看明白,从而提高团队的效率和协调能力。
- 支持多终端设备的浏览器渲染
- 以上就是扯淡简单理解就是:合理的标签做合理的事情
8.请描述css选择器的优先级原则
总结排序:!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性