9.文本样式

最新推荐文章于 2024-05-31 14:44:29 发布

yu&2022

最新推荐文章于 2024-05-31 14:44:29 发布

阅读量64

点赞数

分类专栏： CSS3 文章标签： css

本文链接：https://blog.csdn.net/weixin_45623678/article/details/113972647

版权

CSS3 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

9.文本样式

html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文本样式</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1>斗破苍穹故事简介</h1>
<p clas="p1">讲述了天才少年萧炎在创造了家族空前绝后的修炼纪录后突然成了废人，种种打击接踵而至。就在他即将绝望bai的时候，一缕灵魂从他手上的戒指里浮现，一扇全新的大门在面前开启，经过艰苦修炼最终成就辉煌的故事。
</p>
<p class="p2">这里是属于斗气的世界，没有花俏艳丽的魔法，有的，仅仅是繁衍到巅峰的斗气！
</p>
<p>
萧炎，主人公，萧家历史上空前绝后的斗气修炼天才。4岁就开始修炼斗之气，10岁拥有了九段斗之气，11岁突破十段斗之气，一跃成为家族百年来最年轻的斗者。然而在12岁那年，他却“丧失”了修炼能力，只拥有三段斗之气。整整三年时间，家族冷落，旁人轻视，被未婚妻退婚……种种打击接踵而至。
</p>
<p class="p3">喻亚文</p>
<p class="p4">喻亚文</p>
<p class="p5">喻亚文</p>
<a href="">喻亚文</a>
<p>
    <img src="imag/a.png" alt="图片">
    <span>123456</span>
</p>
</body>
</html>

css:

/*
    1、color： blue rgb 0-F  rgba   a:0~1 透明度
    2、text-align:排版 居中
    3、text-indent: 2em; 段落首行缩进
    background:yellow;背景颜色
    height:300px;
    line-height:300px;
    行高 块高一致 就可以上下居中
    text-decoration:underline   下划线
                    line-through    中划线
                    overline    上划线
    a{
    text-decoration: none;  去下划线
}
*/
h1{
    color:rgba(0,255,255,0.1);
    text-align: center;
}
.p1{
    text-indent: 4em;
}
.p2{
    background: yellow;
    height: 120px;
    line-height: 120px;
}
.p3{
    text-decoration: underline;
}
.p4{
    text-decoration: line-through;
}
.p5{
    text-decoration: overline;
}
a{
    text-decoration: none;
}
/*
水平对齐 ~ 参照物， a,b
*/
img,span{
    vertical-align:center;
}

运行结果：
在这里插入图片描述

yu&2022

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
9.文本样式

9.文本样式html:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>文本样式</title> <link rel="stylesheet" href="css/style.css"></head><body><h1>斗破苍穹故事简介</h1><
复制链接

扫一扫