页面中任何一个元素都可以指定为 弹性布局(Flex) 属性:display 取值: 1、flex 将块级元素变为弹性布局容器 2、inline-flex 将行内元素变为弹性布局容器 兼容性: display:-webkit-flex; 注意:将元素设置为flex后,子元素的 float,clear以 ...
分类:
其他好文 时间:
2017-12-17 18:05:28
阅读次数:
82
连我自己把float和绝对定位,都称为脱离文档流,想想概念又不那么清晰,于是寻找了W3C资料来理解,才发觉不应该叫文档流。 资料 英文:https://www.w3.org/TR/CSS22/visuren.html#normal-flow 中文:http://w3help.org/zh-cn/kb ...
分类:
其他好文 时间:
2017-12-17 17:02:26
阅读次数:
173
在 HTML 文档中,标题很重要。 HTML 标题 标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。 <h1> 定义最大的标题。<h6> 定义最小的标题。 实例 效果展示: 注释:浏览器会自动地在标题的前后添加空行。 注释:默认情况下,HTML 会自动地在块级元素前后添加一个 ...
分类:
Web程序 时间:
2017-12-15 22:31:59
阅读次数:
252
display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始; 高度,行高以及顶和底边距都可控制; 宽度缺省是它的容器的100%,除非设定一个宽度 <div>, <p>, <h1>, <form>, <ul> 和 <li>是块元素的例子。 display:inli ...
分类:
其他好文 时间:
2017-12-12 15:10:50
阅读次数:
119
display: block; "块级元素". display: inline; "行内元素". display: none; "在不删除元素的情况下,隐藏元素,不会占据它本来显示的空间" visibility: hidden; "隐藏元素,但是会占据空间" tip:CSS最重要的控制布局的属性di... ...
分类:
Web程序 时间:
2017-12-12 12:25:43
阅读次数:
161
第七章 1.标准文档流 1.1 标准文档流:指元素根据块元素或行内元素的特性按从上到下,从左到右的方式自然排列。这也是元素默认的排列方式 1.2 标准文档流组成 a.块级元素(block) <h1>…<h6>、<p>、<div>、列表 b.内联元素(inline) <span>、<a>、<img/> ...
分类:
其他好文 时间:
2017-12-11 16:10:40
阅读次数:
105
一、IE6/IE7对display:inline-block的支持欠缺 1、表现描述 这个应该算是很经典的ie兼容性问题了,inline-block作用就是将块级元素以行的等式显示。在主流浏览器中水平显示都没有问题,可是到ie6/ie7下就成垂直显示了。 (1)css代码: #ul-menu{ ma ...
分类:
其他好文 时间:
2017-12-11 13:52:14
阅读次数:
147
CSS中有三种定位机制:普通文档流,浮动和绝对定位。除非指定,否则所有框都是在普通文档流中定位。 浮动:浮动框可以左右移动,直至外边缘碰到包含框或者另一个浮动框的边缘。当一个块级元素浮动起来后,相当于从普通流中抽走了这个块,因而下面的块会占据这个块原本所在的空间即跑到原来的块所在的那一行并占据。而浮 ...
分类:
其他好文 时间:
2017-12-10 15:16:26
阅读次数:
117
1float浮动的属性值 left:向左浮动 right:向右浮动 2、当父元素未浮动,子元素浮动时,就会造成浮动塌陷 实例: 父元素: 子元素: 3、浮动的影响 在允许的空间并排显示,如果空间不够,会自动换行 改变块级元素占据一整行的特性,去掉多余的空间,把宽度缩成本身的内容的宽度或者设置的宽度 ...
分类:
其他好文 时间:
2017-12-04 22:17:39
阅读次数:
233
事例图片: div元素是用于分组HTML元素的块级元素 上图代码示例如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div class="c ...
分类:
Web程序 时间:
2017-12-04 13:18:27
阅读次数:
273