-
css z-index
- z-index属性用于为HTML元素创建“层”。如果您熟悉图像编辑工具,您可能以前使用过图层。这是一个类似的概念。
具有较高z指标值的元素将呈现在具有较低z指标值的元素之上。这可以与上一课的定位相结合,创造出独特的效果。 - 实际应用一例:将背景元素放在所有元素最下面,可以将它的
z-index
设为 -1
- z-index属性用于为HTML元素创建“层”。如果您熟悉图像编辑工具,您可能以前使用过图层。这是一个类似的概念。
-
css
content: ""
- 这将使伪元素为空。
- content 属性用于设置或覆盖元素的内容。 默认情况下,::before 和::after 伪选择器创建的伪元素是空的,元素不会被渲染到页面。 将 content 属性设置为空字符串 “” 将确保元素呈现到页面时仍为空。
-
css
position: absolute
前端——如何用绝对定位(position:absolute)完美定位布局及其注意事项- 父元素:
position: relative
, 当前元素:position: absolute
- 父元素:
-
css
@media
@media 规则,也称为媒体查询,用于有条件地应用 CSS。
应用场景:响应式网页设计。媒体查询通常用于使用
max-width
和min-width
属性根据视口宽度应用 CSS。在下面的示例中,当视口宽度为 960 像素及以下时,填充将应用于 .card 类。
@media (max-width: 960px) { .card { padding: 2rem; } }
-
css
overflow:hidden
应用场景:溢出隐藏、清除浮动、解决外边距塌陷等等
freeCodeCamp 练习5 -- intermediate css
最新推荐文章于 2024-09-06 09:38:49 发布