摘要：
如下的图像 其三个box的高度是相同的，且具有浮动元素，因此可以作为一个类来把其属性都放在一起 这种合并其实不难理解，但是我们在整体的代码设计中很难考虑这一点，这个一定要记住！！ .child{ height: 200px; float: left; } <div class="box"> <div 阅读全文
posted @ 2023-09-07 16:39
sdklxzciosad
阅读(90)
评论(0)
推荐(0)
摘要：
一、什么是圣杯布局 圣杯布局：左右两个盒子固定宽度， 中间盒子自适应 二、圣杯布局的设计原则： 我们现在来思考自适应这个问题，其本质就是 left 和 right 覆盖一整个大的center， 然后center使用padding把内容左右留出left和right相应的宽度。 可是，现在如何来覆盖呢？ 阅读全文
posted @ 2023-09-07 16:28
sdklxzciosad
阅读(202)
评论(0)
推荐(0)
摘要：
一、什么是滑动门布局？ 其代码效果如下所示，其不管中间的文字多长，其图片都可以包含进去！！ 二、如何实现滑动门布局？ 首先，我们通过背景图片，通过 <a> <span> 关于我们 </span> <a> 这种来将内容包裹进去。 然后对a进行 background-img 左边，然后对span进行 b 阅读全文
posted @ 2023-09-07 15:43
sdklxzciosad
阅读(233)
评论(0)
推荐(0)
摘要：
一、一个困扰自己长久的问题 padding 和 margin 其似乎可以实现相同的效果，但是纠结使用哪一个。 现在一个规定： 若是内嵌关系，则使用padding来调整，若是并列关系，则使用margin来调整！ 若是内嵌关系，则使用padding来调整，若是并列关系，则使用margin来调整！ 若是内 阅读全文
posted @ 2023-09-07 11:06
sdklxzciosad
阅读(106)
评论(0)
推荐(0)
摘要：
这个很好理解，记住 <a> 中不仅可以写标签，还可以嵌入文字。 现在效果如下，在<a>中嵌入了<img>，同时又嵌入了<p>，点击图片和文字段落，其都会直接来进行跳转。 这个是非常重要的，一点也不难，耐心做下去。 阅读全文
posted @ 2023-09-07 09:06
sdklxzciosad
阅读(272)
评论(0)
推荐(0)
摘要：
我们平常要涉及很多居中，现在这个要理解 一、文字内容居中 如下，其宽度居中采用text-align，但其高度居中，则让块高度，和行高度保持一致，此时就可以实现宽度居中 二、图片居中于浏览器，img作为行内块元素是无法实现的！ img作为行内块元素，其有行的性质，此时 margin 是没有效果的，如下 阅读全文
posted @ 2023-09-07 08:54
sdklxzciosad
阅读(93)
评论(0)
推荐(0)
摘要：
这个要知道，我们有padding，这个padding指的是内容（举个例子，背景颜色就不属于内容）。 我们在计算内容的宽高时要记住，如下图的对比，padding的这个要理解 若不想加进度 padding 的大小，使用 box-sizing: border-box; 若不想加进度 padding 的大小 阅读全文
posted @ 2023-09-07 08:13
sdklxzciosad
阅读(40)
评论(0)
推荐(0)
摘要：
这俩 background-img 和 img，在图片布局时，我们经常用到，但我们有时很难理解其区别。 简单来说，background-img，其作为背景，图片大小本身无法决定内容的大小！！ 简单来说，background-img，其作为背景，图片大小本身无法决定内容的大小！！ 简单来说，backg 阅读全文
posted @ 2023-09-07 07:56
sdklxzciosad
阅读(277)
评论(0)
推荐(0)
摘要：
“块级元素”、“行内元素”和“行内块”元素，理解这个，才能深入理解css的盒子模型，这个是非常重要的。 其关键是“宽高”，理解“宽高”，“宽高”，“宽高”！！！ 这个是其根本区别，行内元素是由内容撑开，给宽高不起作用！！ 一、行内元素只记住 span 和 a 元素即可 如下，什么 dd,dt都是块级 阅读全文
posted @ 2023-09-07 07:14
sdklxzciosad
阅读(37)
评论(0)
推荐(0)
浙公网安备 33010602011771号