CSS——display和float
1、display 属性规定元素应该生成的框的类型。
值 | 描述 |
---|---|
none | 此元素不会被显示。 |
block | 此元素将显示为块级元素,此元素前后会带有换行符。 |
inline | 默认。此元素会被显示为内联元素,元素前后没有换行符。 |
inline-block | 行内块元素。(CSS2.1 新增的值) |
list-item | 此元素会作为列表显示。 |
run-in | 此元素会根据上下文作为块级元素或内联元素显示。 |
compact | CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。 |
marker | CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。 |
table | 此元素会作为块级表格来显示(类似 <table>),表格前后带有换行符。 |
inline-table | 此元素会作为内联表格来显示(类似 <table>),表格前后没有换行符。 |
table-row-group | 此元素会作为一个或多个行的分组来显示(类似 <tbody>)。 |
table-header-group | 此元素会作为一个或多个行的分组来显示(类似 <thead>)。 |
table-footer-group | 此元素会作为一个或多个行的分组来显示(类似 <tfoot>)。 |
table-row | 此元素会作为一个表格行显示(类似 <tr>)。 |
table-column-group | 此元素会作为一个或多个列的分组来显示(类似 <colgroup>)。 |
table-column | 此元素会作为一个单元格列显示(类似 <col>) |
table-cell | 此元素会作为一个表格单元格显示(类似 <td> 和 <th>) |
table-caption | 此元素会作为一个表格标题显示(类似 <caption>) |
inherit | 规定应该从父元素继承 display 属性的值。 |
2、float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。
如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。left元素向左浮动。right元素向右浮动。none默认值。元素不浮动,并会显示在其在文本中出现的位置。inherit规定应该从父元素继承 float 属性的值。
CSS——display和float的更多相关文章
- CSS display:inline和float:left两者区别探讨
本文和大家重点讨论一下CSS display:inline和float:left两者的区别,CSS display是指显示状态,inline表示内联,特点是紧贴着前一个内联元素,通常默认的内联元素有 ...
- CSS属性之float学习心得
全文参考:http://www.linzenews.com/program/net/2331.html 我们来看看CSS重要属性--float. 以下内容分为如下小节: 1:float属性 2:flo ...
- CSS display:table属性用法- 轻松实现了三栏等高布局
display:table:此元素会作为块级表格来显示(类似 <table>); display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签.目前IE8+以 ...
- css清除浮动float
css清除浮动float 1.分析HTML代码 <div class="outer"> <div class="div1">1</ ...
- 【转】css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?
摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响? 一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class ...
- CSS DISPLAY AND POSITIONING
CSS DISPLAY AND POSITIONING Review: Layout Great job! In this lesson, you learned how to control the ...
- css清除浮动float的几种方法
摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响? 一.抛一块问题砖(display: block)先看现象: 这里我没有给最外层的DIV.outer 设置高度, ...
- CSS学习之float解析
转自:http://www.w3cplus.com/css/float.html 一.float是什么? float即为浮动,在CSS中的作用是使元素脱离正常的文档流并使其移动到其父元素的“最左边”或 ...
- 详解CSS display:inline-block的应用(转)
详解CSS display:inline-block的应用 阅读目录 基础知识 inline-block的问题 inline-block的应用 总结 本文详细描述了display:inline-b ...
随机推荐
- mysql的Replication机制
mysql的Replication机制 参考文档:http://www.doc88.com/p-186638485596.html Mysql的 Replication 是一个异步的复制过程. 从上图 ...
- Css常用收集
/*-------------------------------------- 圆角*/ -webkit-border-radius: 4px; -moz-border-radius: 4px; ...
- WindowsService 创建.安装.部署
windows服务的用法很适合用于一些长期跑的项目..不需要人工操作..不需要服务器一直登陆..很方便.. 不说废话..直接开整.. 启动VS2012..创建Windows服务项目.. 确定..创建成 ...
- bootstrap和bootstrap-select的outline设置
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { ...
- Python开发【第十四篇】:Web框架本质
Web框架本质 众所周知,对于所有的Web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客户端. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 ...
- 如何在html中做圆角矩形和 只有右边的"分隔线"
这个网站满好的,可以常看看 css-matic中有几个很好的写css可视化的工具 其实做css 版式布局等都可以有工具的 推荐40个优秀的免费CSS工具 debugger正则表达式在线 其实是对(理论 ...
- 手机注册获取验证码的PHP代码
php代码 <?php require dirname(__FILE__).'/include/common.inc.php';//这是在cms2008下面做的测试 header("c ...
- golang笔记——IDE
可选方案有 Lite IDE\GoSublime\Visual Studio Code\Goclipse\Vim 1.Lite IDE 这是国人开发的开源且跨平台的 golang 专属IDE,也算是目 ...
- js实现上下滑动侧边栏
给一个原先的电子商务网站做修改,客户说想将原先上下滑动侧边栏改的更加人性化,希望将原先匀速滑动的侧边栏改成变速运动的侧边栏,在到达目的地之前速度越变越慢. 原先一开始的时候,,这个图片是硬生生地到达可 ...
- python 爬虫1
简单访问有道词典的翻译界面,将页面翻译功能简单呈现 import urllib.request import urllib.parse import json content = input(&quo ...