标签：box 浏览器 边框 12.2 12.1 内核 Day12 内联 盒子
前端3+1(Day12)
常见的浏览器内核都有哪些，介绍你对内核的理解
什么是内核，浏览器的作用
浏览器的主要功能就是向服务器发送请求，在浏览器窗口展示您使用的网络资源。这里所说的资源是指HTML文档，pdf，或者图片等其他类型。资源的位置由用户使用URL指定。
浏览器的内核是指，浏览器运行的最核心的程序，分为两个部分：渲染引擎和JS引擎
渲染引擎：
他负责取得网页的内容（HTML，XML，图像等等），整理讯息（加入CSS），以及计算网页的显示方式，然后输出至显示器或者打印机
JS引擎：
解析JavaScript语言，执行JavaScript语言来实现网页的动态交互效果
因为JS引擎越来越独立，所以内核就倾向于渲染引擎
常见的浏览器内核
- Trident（IE内核）
国内很多的双核浏览器其中一核便是Trident，“兼容模式”
-
Gecko（firefox）
-
webkit（safari）
-
Chromium/Bink（chrome）
-
Presto（Opera）
谈谈你对CSS盒模型的理解
盒子分为块级盒子和内联盒子
块级盒子：
-
会换行，width和height属性发挥作用
-
padding，margin，border会将其他元素从当前元素周围推开
内联盒子：
-
width，height不起作用
-
垂直方向的内边距，外边距以及边框会被应用但是不会把其他内联盒子推开
-
水平方向的内边距，外边距以及边框会被应用且会把其他的内联盒子推开
补充：
盒子：每一个盒子都有一个外部盒子和一个内部盒子。
外部盒子：用来决定盒子是块级还是内联
内部盒子：用来决定盒子内部元素是如何布局的，默认都是按照正常的文档流布局
一般经过flex的display，都是改变的是内部盒子
css盒模型
盒模型的各个部分：
-
Content box：这个区域用来显示内容 通过设置width和height
-
Padding box：文本和边框的那个区域，padding设置
-
Border box：盒子的边框，border设置
-
Margin box：盒子最外边的区域，盒子和盒子之间的间距区域，通过margin来设置
标准盒模型：
在标准盒模型里，你设置的width，height，其实是你的content box
padding ，border， 再加上宽高表示盒子整个的大小
但是我们可以是使用IE盒模型,是盒模型的宽度都要加上边框和内边距
html {
box-sizing: border-box;
}
*, *::before, *::after {
box-sizing: inherit;
}
标签：box,浏览器,边框,12.2,12.1,内核,Day12,内联,盒子 来源： https://www.cnblogs.com/summer-like-writing/p/15811197.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。