前端
流泪海盗狗
这个作者很懒,什么都没留下…
展开
-
关于CSS属性margin设置负值的作用
关于margin设置负值的作用在进行类似商城网站的布局时,经常会出现需要布局多个小模块且每个小模块都要有边框border的情况。这时在使用浮动float进行布局时可能会出现父元素宽度不够和小模块高度不对齐的问题。解决方法找到具体的小模块元素,添加类来修改宽高和去除多余的margin。(复杂)通过伪类选择器定位到具体小模块元素统一进行修改。(受浏览器兼容的影响)通过设置margin负值解决。(合适)具体问题在进行考拉海购的这类布局时:父元素宽度设置为1100px,每个小模块的宽度设置为2原创 2020-05-13 22:38:25 · 950 阅读 · 1 评论 -
CSS后代选择器和子代选择器区别
CSS后代选择器和子代选择器后代选择器(A B{……})CSS的后代选择器根据A的所有后代B(包括直接子元素和间接子元素B)来选择。无论B是否被其他所包含,只要B被A包含即被选择。HTML代码和效果:子代选择器(A>B{……})CSS的子代选择器根据A的初代B(只包括直接子元素)来选择。B如果还被其他所包含则B不被选择。HTML代码和效果:...原创 2020-04-28 19:30:13 · 358 阅读 · 1 评论 -
CSS块级盒子和内联盒子
CSS块级盒子和内联盒子块级盒子(Block box)块级盒子:每个盒子都会换行。宽(width)和高(height)属性可以发挥作用,未设置宽的情况下可以扩展并占据父容器的横向空间。外边距(margin)、边框(border)和内边距(padding)会将其他元素从当前盒子周围推开。HTML代码:<DOCTYPE html> <html> ...原创 2020-04-27 22:11:14 · 960 阅读 · 0 评论 -
CSS的工作流程
CSS的工作流程浏览器载入HTML文件。将HTML文件转化成一个DOM。浏览器拉取HTML的大部分资源。浏览器拉取到CSS之后会进行解析,浏览器基于选择器的不同类型找到不同的选择器,将不同的规则应用在对应的DOM节点中,并添加节点的依赖样式——渲染树。渲染树依照应该出现的结构进行布局。网页展示——着色。CSS工作流程图:HTML转化成DOMHTML代码:<p>...原创 2020-04-26 22:47:33 · 482 阅读 · 0 评论 -
在HTML文档中使用CSS的三种方法
在HTML文档中使用CSS的三种方法1.外部样式表外部样式表是指将CSS编写在扩展名为.css的单独文件中,并从HTML元素引用它。这样在大多数情况下,一个站点的不同页面可以使用相同的规则集来获得基本的外观。...原创 2020-04-26 20:35:46 · 1367 阅读 · 0 评论