iframe的缺点
- iframe不利于seo,搜索引擎检索不了
- 会阻塞浏览器的onload加载
会影响浏览器的并行加载
解决方案
<iframe id = 'demo'></demo>
document.querySelector(#demo).src = 'a.html';
盒子模型你是怎么理解的?
盒子模型分为IE模型和W3C模型:
- W3C模型盒子模型包括margin,border,padding content,元素宽度width = content。
- IE与W3C的唯一区别是,元素宽度width = border + padding + content
css3中新增一个样式box-sizing,包含两个属性 content-box和border-box
样式导入有哪些方式?
link
<link href = "index.css" rel="stylesheet">
import
<style type="text/css">
@import "index.css";
</style>
不同点
link除了引用css外,开可以应用其他图片等资源。而import只能引用样式文件。
兼容性不同,link不存在兼容性的问题,import在IE5以上支持,是css2.1新增的。
在样式表文件可以使用import导入其它的样式表文件,而link不可以
link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。
link支持使用Javascript控制DOM去改变样式;而@import不支持。
推荐使用 @import url(index.css);
::before 和:before有什么区别
相同点
都可以用来表示伪类对象,用来设置对象内容。
:befor和::before写法是等效的
不同点
:befor是Css2的写法,::before是Css3的写法
:before的兼容性要比::before好 ,不过在H5开发中建议使用::before比较好
补充
伪类对象要配合content属性一起使用
伪类对象不会出现在DOM中,所以不能通过js来操作,仅仅是在 CSS 渲染层加入
伪类对象的特效通常要使用:hover伪类样式来激活
css样式的优先级是怎么样的?
important>内联>style( #id > class > 标签名) > 外联
同级的优先级是从上往下依次覆盖
如何居中一个元素(正常、绝对定位、浮动元素)?
https://blog.csdn.net/lxcao/article/details/52670724
为什么要初始化CSS样式?
因为浏览器的兼容问题,不同浏览器有些标签的默认值是不同的,如果没有CSS初始化往往会出现浏览器之间的页面显示差异。