字体样式和文本样式
2.2字体样式
/*
font-family:字体
font-weight:字体粗细
font-size:字体大小
color:字体颜色
*/
<style>
body{
font-family: 楷体;
color: red;
}
.p1{
font-weight: bold;
}
h1{
font-size: 100px;
}
</style>
</head>
<body>
<h1>故事介绍</h1>
<p class="p1">
一个卖瓷碗的老人挑着扁担在路上走着，突然一个瓷碗掉到地上摔碎了，但是老人头也不回继续向前走。
路人看到很奇怪，便问：“为什么你的碗摔碎了你却不看一下呢？”老人答到：“我再怎么回头看，碗是碎的。”
</p>
</body>
2.3 文本样式
1、颜色 color rgb rgba
2、文本对齐的方式 text-align =center
3、首行缩进 text-indent:2em
4、行高：line-height
5、装饰：text-decoration
6、文本图片水平对齐：vertical-align: middle;
<style>
h1{
text-align: center;
}
.p1{
text-indent: 2em;
}
.p3{
background: rgba(0,255,255,0.1);
height: 300px;
line-height: 300px;
}
.l1{
text-decoration:underline;
}
.l2{
text-decoration: line-through;
}
.l3{
text-decoration: overline;
}
</style>
</head>
<body>
<p class="l1">123456</p>
<p class="l2">123456</p>
<p class="l3">123456</p>
<h1>故事介绍</h1>
<p class="p1">
一个卖瓷碗的老人挑着扁担在路上走着，突然一个瓷碗掉到地上摔碎了，但是老人头也不回继续向前走。
路人看到很奇怪，便问：“为什么你的碗摔碎了你却不看一下呢？”老人答到：“我再怎么回头看，碗是碎的。”
</p>
<p class="p3">"I love you though my heart begs me to. Every romantic song reminds me of you, and every time I see a happy couple I wish they were you and me." </p>
<a href="image/360截图20240606180405978.jpg"></a>
<span>1234567</span>
</body>
<style>
span,img{
vertical-align: middle;
}
</style>
</head>
<body>
<p><img src="image/360截图20240606180405978.jpg" alt=""><span>1234556</span></p>
</body>
