一、行内元素与块级函数的三个区别
行内元素的特点:
- 和其他元素都在一行上;
- 高,行高及外边距和内边距部分可改变;
- 宽度只与内容有关;
- 行内元素只能容纳文本或者其他行内元素。
- 行内元素设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效
块级元素
- 总是在新行上开始,占据一整行;
- 高度,行高以及外边距和内边距都可控制;
- 宽带始终是与浏览器宽度一样,与内容无关;
- 它可以容纳行内元素和其他块元素。
二、行内元素转换为块级元素
display:block (字面意思表现形式设为块级)
三、行内元素与块级元素
<address> | 定义地址 |
<caption> | 定义表格标题 |
<dd> | 定义列表中定义条目 |
<div> | 定义文档中的分区或节 |
<dl> | 定义列表 |
<dt> | 定义列表中的项目 |
<fieldset> | 定义一个框架集 |
<form> | 创建 HTML 表单 |
<h1> | 定义最大的标题 |
<h2> | 定义副标题 |
<h3> | 定义标题 |
<h4> | 定义标题 |
<h5> | 定义标题 |
<h6> | 定义最小的标题 |
<hr> | 创建一条水平线 |
<legend> | 元素为 fieldset 元素定义标题 |
<li> | 标签定义列表项目 |
<noframes> | 为那些不支持框架的浏览器显示文本,于 frameset 元素内部 |
<noscript> | 定义在脚本未被执行时的替代内容 |
<ol> | 定义有序列表 |
<ul> | 定义无序列表 |
<p> | 标签定义段落 |
<pre> | 定义预格式化的文本 |
<table> | 标签定义 HTML 表格 |
<tbody> | 标签表格主体(正文) |
<td> | 表格中的标准单元格 |
<tfoot> | 定义表格的页脚(脚注或表注) |
<th> | 定义表头单元格 |
<thead> | 标签定义表格的表头 |
<tr> | 定义表格中的行 |
<a> | 标签可定义锚 |
<abbr> | 表示一个缩写形式 |
<acronym> | 定义只取首字母缩写 |
<b> | 字体加粗 |
<bdo> | 可覆盖默认的文本方向 |
<big> | 大号字体加粗 |
<br> | 换行 |
<cite> | 引用进行定义 |
<code> | 定义计算机代码文本 |
<dfn> | 定义一个定义项目 |
<em> | 定义为强调的内容 |
<i> | 斜体文本效果 |
<img> | 向网页中嵌入一幅图像 |
<input> | 输入框 |
<kbd> | 定义键盘文本 |
<label> | 标签为 input 元素定义标注(标记) |
<q> | 定义短的引用 |
<samp> | 定义样本文本 |
<select> | 创建单选或多选菜单 |
<small> | 呈现小号字体效果 |
<span> | 组合文档中的行内元素 |
<strong> | 语气更强的强调的内容 |
<sub> | 定义下标文本 |
<sup> | 定义上标文本 |
<textarea> | 多行的文本输入控件 |
<tt> | 打字机或者等宽的文本效果 |
<var> | 定义变量 |
<button> | 按钮 |
<del> | 定义文档中已被删除的文本 |
<iframe> | 创建包含另外一个文档的内联框架(即行内框架) |
<ins> | 标签定义已经被插入文档中的文本 |
<map> | 客户端图像映射(即热区) |
<object> | object对象 |
<script> | 客户端脚本 |
【CSS3】块级元素与行内元素的区别的更多相关文章
-
python 全栈开发,Day48(标准文档流,块级元素和行内元素,浮动,margin的用法,文本属性和字体属性)
昨日内容回顾 高级选择器: 后代选择 : div p 子代选择器 : div>p 并集选择器: div,p 交集选择器: div.active 属性选择器: [属性~='属性值'] 伪类选择器 ...
-
HTML中块级元素和行内元素的总结和区分。
HTML标签 html标签定义: 是由一对尖括号包裹的单词构成,例如: <html>. 标签不区分大小写<html> 和 <HTML>, 推荐使用小写. 标签分为两 ...
-
HTML中块级元素与行内元素
一.行内元素与块级元素 块级元素列表 <address> 定义地址 <caption> 定义表格标题 <dd> 定义列表中定义条目 <div> 定义文档 ...
-
CSS里常见的块级元素和行内元素
根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级 ...
-
CSS学习笔记——盒模型,块级元素和行内元素的区别和特性
今天本来打算根据自己的计划进行前端自动化的学习的,无奈早上接到一个任务需求需要新增一个页面.自从因为工作需要转前端之后,自己的主要注意力几 乎都放在JavaScript上面了,对CSS和HTML这方面 ...
-
CSS样式设置语法全解,样式优先级、值和单位、字体、文本、块级元素,行内元素,替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景
全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...
-
html块级元素与行内元素
1.关于行内元素和快元素的说明: 根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display ...
-
css块级元素和行内元素详细解析
块级元素和行内元素是布局中常见的两种基本元素,但是未必有很多人深入的研究它们的细微差别. 常见块级元素:div p form ul ol li 等: 常见的行内元素:span stronh em; ...
-
{03--CSS布局设置} 盒模型 二 padding bode margin 标准文档流 块级元素和行内元素 浮动 margin的用法 文本属性和字体属性 超链接导航栏 background 定位 z-index
03--CSS布局设置 本节目录 一 盒模型 二 padding(内边距) 三 boder(边框) 四 简单认识一下margin(外边距) 五 标准文档流 六 块级元素和行内元素 七 浮动 八 mar ...
随机推荐
-
ping命令
ping命令能够用于判断一个主机是否可达或者是否存活.它的工作原理就像潜水艇的探测原理一样.该命令通过向目标计算机发送一个数据包,请求目标计算机回送该数据包以表明自己还存活着.同时该命令还能够知道数据 ...
-
Cassandra1.2文档学习(18)—— CQL数据模型(下)
三.集合列 CQL 3 引入了一下集合类型: •set •list •map 在关系型数据库中,允许用户拥有多个email地址,你可以创建一个email_addresses表与users表存在一个多对 ...
-
.Net 提交页面,js修改的Label值会丢掉
<head id="Head1" runat="server"> <script src="../Jquery/jquery-1.1 ...
-
网易游戏QA工程师笔试回忆-2012.9【个人题解】
========================转帖======================== 网易游戏QA工程师笔试回忆-2012.9 刚刚从武大回来,趁热回忆下题目,给以后的XDJMs参考. ...
-
对于Maven管理的项目制定虚拟目录
基于Maven管理的web项目结构: target目录是用来存放项目打包之后生成的文件的目录,此目录中的文件必须调用mvn clean package后才能生成, 如果把虚拟目录设置在此目录中,则每次 ...
-
python路径函操作
#判断是否为文件 os.path.isfile #判断是否为目录 os.path.isdir #返回文件名 os.path.basename(path) #返回文件目录 os.path.d ...
-
android.graphics.Matrix
Matrix类包含了一个3x3的矩阵用来改变坐标,它没有一个构造器来初始化它里边的内容,所以创建实例后需要调用reset()方法生成一个标准matrix,或者调用set..一类的函数,比如setTra ...
-
Linq 入门 顺带 Func与Action
Linq的优点: 查询是一种从数据源检索数据的表达式. 查询通常用专门的查询语言来表示. 随着时间的推移,人们已经为各种数据源开发了不同的语言:例如,用于关系数据库的 SQL 和用于 XML 的 XQ ...
-
Dijango学习_01_pycharm创建应用
一.当初在学dijango的时候,网上的教程非常的杂且多,对于؏؏☝ᖗ乛◡乛ᖘ☝؏؏我们这种初入虎门的小白来说有太多误区 (其实是大佬的操作着实对小白不太友好,原谅我个萌新..2333..) 二.pi ...
-
【XSY2750】Mythological V 2-sat
题目描述 有一棵\(n\)个点的树,还有\(m\)个物品. 你要把每个物品放在树上的一个点上(两个物品可以放在同一个点). 有\(q\)个限制:\(a,b\)两个物品在路上的最短路经过\(c\). 要 ...