块级元素与内联元素

本文详细介绍了HTML中块级元素与内联元素的区别,包括它们的布局特性、嵌套规则以及常见元素示例。块级元素如div、dl、form等占据整行空间,而内联元素如a、b、span等则根据内容决定是否换行。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

块级元素占一行,不论内容多少只要是有2个这样的元素就会换行,行内元素内容少时不会换行。这是个重要区别。

内联元素不能嵌套块元素,否则会造成浏览器解析错误。

块级元素(block element)
div -最常用的块级元素
dl - 和dt dd搭配使用的块级元素

/*

dl dt dd是一个组合型标签
标签标准用法,代码如下

 
  1. <</span>dl> 
  2. <</span>dt>标题1</</span>dt> 
  3. <</span>dd>列表1</</span>dd> 
  4. <</span>dd>列表2</</span>dd> 
  5. </</span>dl> 

同时dd内可以放标签使用。

*/
form - 交互表单
h1 - 大标题
hr - 水平分隔线
ol - 排序表单
p - 段落
ul - 非排序列表

内联元素(inline element)
a - 锚点
b - 粗体(不推荐)
br - 换行
em - 强调
font - 字体设定(不推荐)
i - 斜体
img - 图片
input - 输入框
label - 表格标签
select - 项目选择
small - 小字体文本
span - 常用内联容器,定义文本内区块
strike - 中划线
strong - 粗体强调
sub - 下标
sup - 上标
textarea - 多行文本输入框
tt - 电传文本
u - 下划线

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值