ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
## 内联元素和区块元素简介 我们在之前的练习中发现,HTML标签具有不同的特性。 实际上,我们可以将HTML元素分为两大类:区块元素和内联元素。 ### 内联元素和区块元素 **区块元素** * 总是在新的一行上显示。 * 高度、行高、宽度、内边距、外边距等都是可控制的。 * 高度默认为0,是根据元素内的内容而决定的,宽度是父元素的宽度,但是可以通过css控制它,显示的指定他的宽度和高度,可以利用浮动和定位来将他与其他的块元素也显示在一行上。 * 实例: `<h1>`,`<p>`, `<ul>`,` <table>`。 **内联元素** * 内联元素和其他的元素显示在一行上。 * **上下边距**、高度,宽度都是不可改变的,他的宽度是根据他的显示文本和图像的宽度。 * 实例: `<b>`, `<td>`, `<a>`, `<img>`。 ![](https://box.kancloud.cn/7b5873c0942dfc596cc27222d9904c1a_292x439.png) ![](https://box.kancloud.cn/b058202024c88e8c95c213b7ba95b934_339x439.png) **常用的内联元素** * a - 锚点 * em - 强调 * img - 图片 ### `<div>`元素 * HTML`<div>`元素是块级元素,它可用于组合其他HTML元素的容器。 * `<div>`元素没有特定的含义。由于它属于块级元素,浏览器会在其前后显示换行。 * 如果与 CSS 一同使用,`<div>`元素可用于对大的内容块设置样式属性。 ![](https://box.kancloud.cn/e65c7a30bdc9dd8c6884128629acca97_475x214.png) ### `<span>`元素 * HTML `<span>`元素是内联元素,可用作文本的容器 * `<span>`元素也没有特定的含义。 * 当与 CSS 一同使用时,`<span>`元素可用于为部分文本设置样式属性。