添加预览

This commit is contained in:
2025-02-27 13:01:50 +08:00
parent 1a2977974f
commit 8993455dfb
4 changed files with 68 additions and 5 deletions

View File

@@ -1,4 +1,4 @@
# HTML 基本标签
# HTML 基本标签 —— 标题和段落
> [!NOTE]
> 这是测试的版本
@@ -16,7 +16,7 @@
<h6>标题 6</h6>
```
给六个标题字体颜色换一下,注意:`color` 表示字体颜色。
给六个标题字体颜色换一下,注意:`color` 表示**字体颜色**
```css
h1 {
@@ -85,7 +85,7 @@ p {
### 要求
完成《白鹭》散文的排版:
完成下面《白鹭》散文(节选)的排版:
- 标题:使用 `h1` 标签,设置字号 32px颜色黑色;
- 每个段落:设置字号 28px颜色#333),行间距 40px首行缩进两字符
@@ -103,3 +103,24 @@ p {
然而白鹭却因为它的常见,而被人忘却了它的美。
那雪白的蓑毛,那全身的流线型结构,那铁色的长喙,那青色的脚,增之一分则嫌长,减之一分则嫌短,素之一忽则嫌白,黛之一忽则嫌黑。
### 效果
```html preview
<h1 style="font-size: 32px; color: black;">白鹭</h1>
<p style="font-size: 28px; color: #333; line-height: 40px; text-indent: 2em">白鹭是一首精巧的诗。</p>
<p style="font-size: 28px; color: #333; line-height: 40px; text-indent: 2em">色素的配合,身段的大小,一切都很适宜。</p>
<p style="font-size: 28px; color: #333; line-height: 40px; text-indent: 2em">白鹤太大而嫌生硬,即如粉红的朱鹭或灰色的苍鹭,也觉得大了一些,而且太不寻常了。</p>
<p style="font-size: 28px; color: #333; line-height: 40px; text-indent: 2em">然而白鹭却因为它的常见,而被人忘却了它的美。</p>
<p style="font-size: 28px; color: #333; line-height: 40px; text-indent: 2em">那雪白的蓑毛,那全身的流线型结构,那铁色的长喙,那青色的脚,增之一分则嫌长,减之一分则嫌短,素之一忽则嫌白,黛之一忽则嫌黑。</p>
```
## 总结
### HTML
标题h1 到 h6
段落p
### CSS
color 字体颜色
font-size 字体大小
line-height 行间距
text-indent: 2em; 表示首行缩进2字符