【html学习笔记16】- 块和内联元素

2023-08-29  本文已影响0人  兔小小

每个 HTML 元素都有一个默认显示值,具体取决于哪种类型的元素。有两个显示值:内联

块级元素

块级元素总是在新的行开始,浏览器自动在元素前后添加一些空格(设置边距)。块级元素始终占据可用的整个宽度 (尽可能向左和向右伸展)。

两个常用的块元素是:<p><div>。元素<p>定义一个段落 HTML 文档。元素<div>定义分隔或 HTML 文档中的某个部分。

<p>Hello World</p>
<div>Hello World</div>

<div>元素通常用作其他 HTML 元素的容器。该元素没有必需的属性,但是styleclassid是通用的。当与 CSS 一起使用时,该元素可用于设置内容:<div>

<div style="background-color:black;color:white;padding:20px;">
  <h2>London</h2>
  <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>

其他的HTML块元素


内联元素

内联元素不会从新行开始。内联元素仅占用所需的宽度。使用元素<span>。注意内联元素不能包含块级元素!

<span>Hello World</span>

元素<span>是用于标记文本的一部分或文档的一部分的内联容器。该元素没有必需的属性,但styleclassid是通用的。当与 CSS 一起使用时,该元素可用于设置部分文本的样式

<p>My mother has <span style="color:blue;font-weight:bold;">blue</span> eyes and my father has <span style="color:darkolivegreen;font-weight:bold;">dark green</span> eyes.</p>

其他的HTML内联元素

上一篇下一篇

猜你喜欢

热点阅读