用html编写的简易新闻页面

用html编写的简易新闻页面

相关代码

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .title {
            text-align: center;
            font-weight: bolder;
            font-family: '微软雅黑';
            font-size: 40px;
        }
        .time {
            text-align: right;
        }
        p {
            text-indent: 2em;
        }
        .picture {
            text-align: center;
        }
        img {
            width: 400px;
        }
        .finally {
           text-align: right; 
        }
    </style>
</head>
<body>
    <div>
        <div class="title">这是新闻标题</div>
        <p class="time">2024年2月23日</p>
        <hr>
    </div>
    <div>
        <p>这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段</p>
        <p>这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段  </p>
        <div class="picture">
            <img src="./fly_2.23.jpg" alt="图片没有成功加载出来">
        </div>
        <p>这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段</p>
        <p>这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段</p>
    </div>
    <div class="finally">这是落款</div>
</body>
</html>

代码截图

运行效果

相关推荐
by2099910 分钟前
从结构体到对象:正式学习C++类的骨架、封装与this指针
c++·经验分享·学习
乌暮23 分钟前
深入理解 Java 泛型:把「万能盒子」用对、用稳
java·开发语言·后端·学习
行者-全栈开发33 分钟前
【前端/JS框架】CVE-2026-3854:GitHub Enterprise Server X-Stat注入XSS漏洞深度剖析与紧急修复指南
前端·javascript·github
计算机魔术师1 小时前
AMD砸82亿买下李飞飞,这次不卖芯片卖什么?
前端
小雪崩1 小时前
嵌入式学习 day60:ARM汇编——触摸屏与SPI
汇编·arm开发·学习
hzxpaipai2 小时前
杭州企业官网怎么建设?从策划到上线的5步建站方法
运维·服务器·前端·网络
怕浪猫2 小时前
2026年金九银十,我面了22个前端
前端·javascript·面试
IT_陈寒2 小时前
Vue 这个响应式陷阱,我的头发都掉没了
前端·人工智能·后端
前端的日常2 小时前
一个人+AI做情侣食谱小程序,30天纯赚
前端·javascript·后端
问天_观心2 小时前
大模型训练与推理优化(二)
人工智能·深度学习·学习·大模型·transformer