css中行内元素和块级元素的区别
我的图书馆
css中行内元素和块级元素的区别
本文导读：HTML中的元素可分为两种类型：块级元素和行级元素。这些元素的类型是通过文档类型定义（DTD）来指明。块级元素：显示在一块内，会自动换行，元素会从上到下垂直排列，各自占一行，如p,ul,form,div等标签元素。行内元素：元素在一行内水平排列，高度由元素的内容决定，height属性不起作用，如span,input等元素。
一、块级元素：block element
每个块级元素默认占一行高度，一行内添加一个块级元素后无法一般无法添加其他元素（float浮动后除外）。两个块级元素连续编辑时，会在页面自动换行显示。块级元素一般可嵌套块级元素或行内元素；
块级元素一般作为容器出现，用来组织结构，但并不全是如此。有些块级元素，如&form&只能包含块级元素。其他的块级元素则可以包含 行级元素如&P&.也有一些则既可以包含块级，也可以包含行级元素。
DIV 是最常用的块级元素，元素样式的display:block都是块级元素。它们总是以一个块的形式表现出来，并且跟同级的兄弟块依次竖直排列，左右撑满。
二、行内元素：inline element
也叫内联元素、内嵌元素等；行内元素一般都是基于语义级(semantic)的基本元素，只能容纳文本或其他内联元素，常见内联元素 “a”。比如 SPAN 元素，IFRAME元素和元素样式的display : inline的都是行内元素。例如文字这类元素，各个字母 之间横向排列，到最右端自动折行。
三、block（块）元素的特点①、总是在新行上开始；②、高度，行高以及外边距和内边距都可控制；③、宽度缺省是它的容器的100%，除非设定一个宽度。④、它可以容纳内联元素和其他块元素&
四、inline元素的特点①、和其他元素都在一行上；②、高，行高及外边距和内边距不可改变；③、宽度就是它的文字或图片的宽度，不可改变④、内联元素只能容纳文本或者其他内联元素
对行内元素，需要注意如下
设置宽度width 无效。
设置高度height 无效，可以通过line-height来设置。
设置margin 只有左右margin有效，上下无效。
设置padding 只有左右padding有效，上下则无效。注意元素范围是增大了，但是对元素周围的内容是没影响的。
五、常见的块状元素
address – 地址
blockquote – 块引用
center – 举中对齐块
dir – 目录列表
div – 常用块级容易，也是CSS layout的主要标签
dl – 定义列表
fieldset – form控制组
form – 交互表单
h1 – 大标题
h2 – 副标题
h3 – 3级标题
h4 – 4级标题
h5 – 5级标题
h6 – 6级标题
hr – 水平分隔线
isindex – input prompt
menu – 菜单列表
noframes – frames可选内容，（对于不支持frame的浏览器显示此区块内容
noscript – 可选脚本内容（对于不支持script的浏览器显示此内容）
ol – 有序表单
pre – 格式化文本
table – 表格
ul – 无序列表
六、常见的内联元素
abbr – 缩写
acronym – 首字
b – 粗体(不推荐)
bdo – bidi override
big – 大字体
br – 换行
cite – 引用
code – 计算机代码(在引用源码的时候需要)
dfn – 定义字段
em – 强调
font – 字体设定(不推荐)
img – 图片
input – 输入框
kbd – 定义键盘文本
label – 表格标签
q – 短引用
s – 中划线(不推荐)
samp – 定义范例计算机代码
select – 项目选择
small – 小字体文本
span – 常用内联容器，定义文本内区块
strike – 中划线
strong – 粗体强调
sub – 下标
sup – 上标
textarea – 多行文本输入框
tt – 电传文本
u – 下划线
七、行内元素与块级元素有什么不同？
块级：块级元素会独占一行，默认情况下宽度自动填满其父元素宽度
行内：行内元素不会独占一行，相邻的行内元素会排在同一行。其宽度随内容的变化而变化。
块级：块级元素可以设置宽高
行内：行内元素不可以设置宽高
块级：块级元素可以设置margin，padding
行内：行内元素水平方向的margin- margin- padding- padding-可以生效。但是竖直方向的margin- margin- padding- padding-却不能生效。
块级：display:
行内：display:
可以通过修改display属性来切换块级元素和行内元素
TA的最新馆藏[转]&[转]&[转]&[转]&[转]&[转]&行内元素与块级元素比较全面的区别和转换
行内元素与块级元素比较全面的区别和转换
一、行内元素与块级元素
块级元素列表
定义表格标题
定义列表中定义条目
定义文档中的分区或节
定义列表中的项目
&fieldset&
定义一个框架集
创建 HTML 表单
定义最大的标题
定义副标题
定义最小的标题
创建一条水平线
元素为 fieldset 元素定义标题
标签定义列表项目
&noframes&
为那些不支持框架的浏览器显示文本，于 frameset 元素内部
&noscript&
定义在脚本未被执行时的替代内容
定义有序列表
定义无序列表
标签定义段落
定义预格式化的文本
标签定义 HTML 表格
标签表格主体（正文）
表格中的标准单元格
定义表格的页脚（脚注或表注）
定义表头单元格
标签定义表格的表头
定义表格中的行
行内元素列表
标签可定义锚
表示一个缩写形式
定义只取首字母缩写
可覆盖默认的文本方向
大号字体加粗
引用进行定义
定义计算机代码文本
定义一个定义项目
定义为强调的内容
斜体文本效果
向网页中嵌入一幅图像
定义键盘文本
标签为 input 元素定义标注（标记）
定义短的引用
定义样本文本
创建单选或多选菜单
呈现小号字体效果
组合文档中的行内元素
语气更强的强调的内容
定义下标文本
定义上标文本
&textarea&
多行的文本输入控件
打字机或者等宽的文本效果
可变元素素列表--可变元素为根据上下文语境决定该元素为块元素或者内联元素
定义文档中已被删除的文本
创建包含另外一个文档的内联框架（即行内框架）
标签定义已经被插入文档中的文本
客户端图像映射（即热区）
object对象
客户端脚本
二、行内元素与块级函数的三个区别
1.行内元素与块级元素直观上的区别
& & 行内元素会在一条直线上排列，都是同一行的，水平方向排列
& & 块级元素各占据一行，垂直方向排列。块级元素从新行开始结束接着一个断行。
2.块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素。
3.行内元素与块级元素属性的不同，主要是盒模型属性上
行内元素设置width无效，height无效(可以设置line-height)，margin上下无效，padding上下无效
三、行内元素转换为块级元素
& & & & display:block (字面意思表现形式设为块级)
我的热门文章
即使是一小步也想与你分享行内元素与块级元素区别_百度文库
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
行内元素与块级元素区别
上传于|0|0|文档简介
&&韩顺平,html章节,总结
阅读已结束，如果下载本文需要使用0下载券
想免费下载更多文档？
定制HR最喜欢的简历
你可能喜欢块级元素和行内元素的区别_HTML元素基本类型
合作共赢、快速高效、优质的网站建设提供商
深圳网站建设 服务热线:6
块级元素和行内元素的区别
& 在HTML中元素可分为两大基本类型，块级元素的和行内元素.& 块级元素包含有一大块内容，应该被显示在自己的行上，它们可以用来将长长的文本侵害为一些段落，标题和列表等可管理的部分，行内元素通常会包含一串较短的文本，并且被呈现在同一行上其他文本的旁边，如句子中一些着重强调的词就可以被称记为行内元素。
& 所有非空白块级元素都能包含文本和行内元素,它们中白大多数琮要以包含其他块级元素,相比之下,非空白行内元素则只能包含文本或其他行内元素,例如,em元素是行内元素,用于对其中白文本加以强调,而p元素是块级元素,用于标明文本段落,因为em是行内元素,不能包含块级元素,所以下面白例子是错误白,无效的;&em&&p&hell,liqiulin&/p&&/em&在以后的编写HTML时大家一定注意，写错了，就无效。}