第2页 - 油条一大碗

清除浮动的最佳实践1. 概念清除浮动: 浮动一定要封闭到一个盒子中,否则就会对页面后续元素产生影响。当子元素浮动后,父元素如果不设置高度,就会出现高度塌陷的问题,影响后续布局。2. 清除浮动方法 1: 使用 BFC2.1 原理让内部有浮动的父盒子形成 BFC,它就能关闭住内部的浮动。此时,最好的方法就是 overflow: hidden; 属性。2.2 示例* { margin: 0; ...

2026年02月23日

BFC 规范1. 概念BFC (Block Formatting Context,块级格式上下文) 是页面上的一个隔离的独立容器。容器里的子元素不会影响到外面的元素反之亦然示例一个盒子不设置 height,当内容子元素都浮动时,无法撑起自身。原因: 这个盒子没有形成 BFC。2. 创建 BFC2.1 创建 BFC 的方法方法说明备注float 的值不是 nonefloat: left 或 r...

2026年02月23日

浮动布局基础1. 概念网页布局的本质是:用 CSS 来摆放盒子,把盒子摆放到页面对应的位置。在 CSS 中提供了以下几种不同的布局策略来实现页面的布局:正常布局流浮动布局定位布局表格布局 (display: table)响应式设计弹性布局网格布局多列布局以上每种布局方式,都有自己的用途,也有各自的优缺点,相互辅助。2. 正常布局流(Normal Flow)2.1 概念正常布局流(normal...

2026年02月23日

CSS 函数详解一、calc() 函数calc() 函数用于动态计算长度值。基本语法 width: calc(100px + 200px); width: calc(100px - 50px * -1); width: ...

2026年02月23日

不透明度 (opacity)一、opacity 概述opacity 属性指定了一个元素的不透明度。属性值属性值描述0元素完全透明(即元素不可见)0.0 - 1.0元素半透明(元素后面的背景可见),值越大,元素透明度越低1元素完全不透明(即元素后面的背景不可见)二、基本用法案例演示<style> .item { width: 100px; height: 100...

2026年02月23日