目录： 1. CSS浮动属性float详解 2. CSS常见页面布局 3. CSS浮动清除和清除浮动的几种方法 4. 高度塌陷的产生条件和解决方法 ## CSS浮动属性float详解 *首先，我们需要了解什么是浮动？浮动是指(浮动的特点)：- 将元素排除在普通流之外，即元素将脱离标准文档流。- 元素 ...
分类：
Web程序 时间：
2020-03-01 17:10:05
阅读次数：
87
在前端开发中，表格主要用于存储结构化的数据，CSS主要用于修饰DOM元素，如何通过DOM来操作表格及CSS呢？本文主要通过一些简单的小例子，简述DOM对表格和CSS的常见操作方法，仅供学习分享使用，如有不足之处，还请指正。 ...
分类：
编程语言 时间：
2020-03-01 00:11:29
阅读次数：
93
清除浮动 清除浮动主要为了解决父级元素因为子级浮动引起内部高度为0 塌陷的问题。 清除浮动的方法 在CSS中，clear属性用于清除浮动，其基本语法格式如下： 额外标签法 通过在浮动元素末尾添加一个空的标签（块级元素）例如 父级添加overflow属性方法 可以给父级添加： overflow为 hi ...
分类：
Web程序 时间：
2020-02-29 00:28:39
阅读次数：
102
题目： 假设高度已知，请写出三栏布局，其中左栏、右栏宽度各为300px，中间自适应的设置方案有几种？ 这里考察的是你对CSS的理解 首先初始化样式 HTML编写 由于三栏布局HTML代码几乎差不多，下面就不过多重复编写了。 注： 浮动解决方案需要将 的类标签与 类互换位置即可。 下面我们将通过修改 ...
分类：
其他好文 时间：
2020-02-28 20:47:54
阅读次数：
37
一，浮动元素是如何定位的 当一个元素浮动之后，它会被移除正常的文档流，然后向左或者向右平移，一直平移直到碰到了所处的容器的边框，或者碰到另外一个浮动的元素 这是一个栗子： 运行结果： 二，解决浮动的副作用： 1. 针对父元素： 注意：如果一个元素里只有浮动元素，那它的高度会是0.如果你想要的它自适应 ...
分类：
其他好文 时间：
2020-02-28 19:00:25
阅读次数：
55
简单总结一下常用的水平垂直居中方案 直接在父级元素设置 text-align 和 line-height ,针对未浮动的行内元素 1 <div class="box"> 2 <span class="item">我是span标签</span> 3 </div> 1 .box { 2 width: 6 ...
分类：
Web程序 时间：
2020-02-28 13:36:26
阅读次数：
65
你是如何理解 HTML 语义化的？ 语义化：指对文本内容的结构化（内容语义化），选择合乎语义的标签（代码语义化）。 举例：段落用 p，边栏用 aside，主要内容用 main 标签。 好处： 便于开发者阅读和维护 有利于SEO：让浏览器的爬虫和辅助技术更好的解析， 语义化标签介绍： 在HTML5出来 ...
分类：
Web程序 时间：
2020-02-27 23:33:51
阅读次数：
81
左侧浮动或者绝对定位，右侧通过margin撑开 使用flex 使用<div>包含，然后靠margin形成bfc（百科：block formatting context块级格式化上下文 bfc是一个独立的渲染区域，只有block-level box参与，他规定了包括内部的block-level box ...
分类：
其他好文 时间：
2020-02-27 18:56:32
阅读次数：
46
CSS的三种布局机制 普通流（标准流） 普通流中主要分为两个板块，一个是块级元素，一个是行内元素 块级元素 块级元素的特点就是独占一行，从上到下顺序排列 块级元素：div、hr、p、h1~h6、ul、ol、dl、form、table、... 行内元素 行内袁术会按照顺序从左到右的顺序排列，直到父元素 ...
分类：
Web程序 时间：
2020-02-26 01:03:52
阅读次数：
339
文本主要内容 标准文档流 标准文档流的特性 行内元素和块级元素 行内元素和块级元素的相互转换 浮动的性质 浮动的清除 浏览器的兼容性问题 浮动中margin相关 关于margin的IE6兼容问题 标准文档流 标准文档流的特性 （1）空白折叠现象： 无论多少个空格、换行、tab，都会折叠为一个空格。 ...
分类：
Web程序 时间：
2020-02-25 00:00:49
阅读次数：
110
