这次给大家带来html的内联元素和块级元素有哪些不同，使用html的内联元素和块级元素的注意事项有哪些，下面就是实战案例，一起来看一下。
html标签分为两种，内联元素和块级元素，首先我们先了解一下内联元素和块级元素的概念：
块级元素：一般是其它元素的容器，可容纳内联元素和其它块级元素，块级元素排斥其它元素与其位于同一行，可设置宽度(width)高度(height)属性，正常流中的块级元素会垂直摆放。常见块状元素为“div”
内联元素（行内元素）：内联元素只能容纳文本或者其他内联元素，是块级元素的后代，它允许其他内联元素与其位于同一行，不能设置高度（height）和宽度（width）。常见内联元素为“a”。
根据块级元素的概念我们可以理解为块级元素前后带有换行符，也就相当于元素前后加了一个
标签。我们可以把块级元素想象成一个块或一个矩形，所以块级元素能设置高度宽度属性
立即学习“前端免费学习笔记（深入）”；
例：
css文件:
#div1{ width:200px; height:200px; background:#666 } div2{ width:200px; height:200px; background:#F00 }
html文件：
div1 块级元素排斥其他元素与其位于同一行div2 块级元素排斥其他元素与其位于同一行
两个div元素不位于同一行
根据内联元素的概念，我们可以理解为内联元素前后没有换行符。我们可以把内联元素想象成一条线，所以它不能设置height属性和width属性。
块级元素（block element）标签
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 – 排序表单
p – 段落
pre – 格式化文本
table – 表格
ul – 非排序列表
内联元素(inline element)
a – 锚点
abbr – 缩写
acronym – 首字
b – 粗体(不推荐)
bdo – bidi override
big – 大字体
br – 换行
cite – 引用
code – 计算机代码(在引用源码的时候需要)
dfn – 定义字段
em – 强调
font – 字体设定(不推荐)
i – 斜体
img – 图片
input – 输入框
kbd – 定义键盘文本
label – 表格标签
q – 短引用
s – 中划线
samp – 定义范例计算机代码
select – 项目选择
small – 小字体文本
span – 常用内联容器，定义文本内区块
strike – 中划线
strong – 粗体强调
sub – 下标
sup – 上标
textarea – 多行文本输入框
tt – 定义打字机文本
var – 定义变量
相信看了这些案例你已经掌握了方法，更多精彩请关注创想鸟其它相关文章！
相关阅读：
base标签需要如何使用
html中如何使用js来获取本地系统时间
a标签中怎样设置隐藏其他属性只显示图片
以上就是html的内联元素和块级元素有哪些不同的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1545800.html
微信扫一扫 
支付宝扫一扫 
