css样式
作者:互联网
字体样式(font)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
<!--
font-family 字体
text-align 位置
font-size 大小
font-weight 粗细
color 颜色
px 像素
em 字体
-->
body{
font-family: 楷体;
}
h1{
font-size: 20px;
}
.p1{
font-weight: bold;
}
</style>
</head>
<body>
<h1>年有季节,春夏秋冬;日有季节,黑白交替;生命也该有季节,那是生老病死。</h1>
<p class="p1">乔治、赫伯特说过:“一个人如果20岁不英俊,30岁不强壮,40岁不富有,50岁不睿智,那么他这辈子
就别想英俊、强壮、富有和睿智了。”这是西方人眼中的生命的季节。</p>
<p>孔老先生说过:“吾十有五而志于学,三十而立,四十而不惑,五十而知天命,六十而耳顺,七十而从心
所欲,不逾矩。”也属一种对生命的季节的限定,但孔老先生只有勇气限定自己,怯于给别人下论断。</p>
<p>不管怎样,正如中国古话所说:“朝闻道,夕死可矣。”它告诉人们:不论在什么时候,只要你明白了生
命的好处所在,你就开始了生命的春天。</p>
</body>
</html>
文本样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/* 颜色:
单词
RGB 红绿黑 0~F
RGB A 红绿黑 透明(0~1)
text-align 排版
text-indent 段落首行缩进
height: 300px;
line-height: 300px; 行高和块高一致,就可以上下居中
text-decoration: underline; 下划线
text-decoration: line-through 中划线
text-decoration: overline; 上划线
超链接去掉下划线(因为a标签默认有下划线)
a{
text-decoration:none;
}
*/
h1{
color:rgba(0,255,12,0.9) ;
text-align: center;
}
#p1{
text-indent: 2em;
}
#p2{
background: #4336ff;
height: 300px;
line-height: 300px;
}
/*下划线*/
.l1{
text-decoration: underline;
}
/* 中划线*/
.l2{
text-decoration: line-through;
}
/* 上划线*/
.l3{
text-decoration: overline;
}
</style>
</head>
<body>
<p class="l1">231323</p>
<p class="l2">231323</p>
<p class="l3">231323</p>
<h1>年有季节,春夏秋冬;日有季节,黑白交替;生命也该有季节,那是生老病死。</h1>
<p id="p1">乔治、赫伯特说过:“一个人如果20岁不英俊,30岁不强壮,40岁不富有,50岁不睿智,那么他这辈子
就别想英俊、强壮、富有和睿智了。”这是西方人眼中的生命的季节。</p>
<p id="p2">孔老先生说过:“吾十有五而志于学,三十而立,四十而不惑,五十而知天命,六十而耳顺,七十而从心
所欲,不逾矩。”也属一种对生命的季节的限定,但孔老先生只有勇气限定自己,怯于给别人下论断。</p>
<p>不管怎样,正如中国古话所说:“朝闻道,夕死可矣。”它告诉人们:不论在什么时候,只要你明白了生
命的好处所在,你就开始了生命的春天。</p>
</body>
</html>
文本图片水平居中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/*文本图片水平对齐*/
img,span{
vertical-align: middle;
}
</style>
</head>
<body>
<p>
<img src="../resource/images/a.jpg" alt="">
<span>sdasdasdsa</span>
</p>
</body>
</html>
标签:生命,样式,text,300px,decoration,季节,font,css 来源: https://www.cnblogs.com/YaoJingGuai/p/14372609.html