2022-4-12作业

Cloud_vv

已于 2022-04-12 20:49:40 修改

阅读量336

点赞数

文章标签： html

于 2022-04-12 19:49:04 首次发布

本文链接：https://blog.csdn.net/Cloud_vv/article/details/124131731

版权

自己去网上找一片文章（或者诗词），编写成网页，要求：
1、整个文章居中显示，字体：微软雅黑（或者其他支持的字体）
2、如果是文章则每个段落首行缩进2个字符，诗词除外
3、作者信息： 0.5倍字符，带下划线，并斜体
4、使用任意一张图片作为背景，且背景固定不随内容的滚动滚动
5、内容多复制几份，实现滚动条，使用锚点实现返回顶部，去到底部等功能
6、其他功能越多越好，可自己发挥…

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
<style>
    p{
        font-family: "微软雅黑"; 
        text-align: center;
    }
    #tittle{
        font-size: 2em;
    }
    #author{
        font-size: 0.5em;
        text-decoration: underline;
        font-style: italic;
    }
    body {
            background-image: url("https://s1.ax1x.com/2022/04/12/LnFZHx.jpg");
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: 1300px 600px;
        }
    
</style>
</head>
<body>
    <p id="content"></p>
    <p id="tittle">《观潮》</p>
    <p id="author">苏轼</p>
    <p>庐山烟雨浙江潮，未到千般恨不消。</p>
    <p>及至到来无一事，庐山烟雨浙江潮。</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <p>cloudvv</p>
    <a href="#content">回到顶部</a>

</body>
</html>

Cloud_vv

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2022-4-12作业

自己去网上找一片文章（或者诗词），编写成网页，要求：1、整个文章居中显示，字体：微软雅黑（或者其他支持的字体）2、如果是文章则每个段落首行缩进2个字符，诗词除外3、作者信息： 0.5倍字符，带下划线，并斜体4、使用任意一张图片作为背景，且背景固定不随内容的滚动滚动5、内容多复制几份，实现滚动条，使用锚点实现返回顶部，去到底部等功能6、其他功能越多越好，可自己发挥…<!DOCTYPE html><html lang="en"><head> &lt
复制链接

扫一扫