文章目录

  • 1、前言
  • 2、步骤
  • 3、效果图
  • 4、总结


1、前言

昨天发布了一个有关登录页面的设计。今天这个新闻页面也是利用表格,表单知识来完成的。两个页面都做好后可以通过link链接,从登录页面跳转到新闻页面。

2、步骤

代码如下:

<!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>新闻</title>
</head>

<body>
    <h1>新闻网站</h1>

    <table border="1">
        <!-- 第一小块 -->
        <!-- tr:一行  td:一格 -->
        <tr>
            <td>
                <h2><a href="./新闻网站3.html">国内新闻</a></h2>
            </td>
            <td>
                <h3>热点新闻</h3>
                <table border="1">
                    <tr>
                        <td>周杰伦将于7月15日出新专辑!</td>
                    </tr>
                    <tr>
                        <td>疫情下:何时结束这闹剧?</td>
                    </tr>
                </table>
            </td>
        </tr>
        <!-- 第二小块 -->
        <tr>
            <td>
                <h2>国际新闻</h2>
            </td>
            <td>
                <h3>焦点新闻</h3>
                <table border="1">
                    <tr>
                        <td>俄罗斯与乌克兰战争已经打响!</td>
                    </tr>

                    <tr>
                        <td>美国人民表明对拜登不满的态度</td>
                    </tr>
                </table>
            </td>
        </tr>

    </table>


</body>
</html>

3、效果图

如下:

html5新闻发布源代码 html关于新闻的网页代码_html

4、总结

以上就是今天要讲的内容,本文简单介绍了表格表单相关知识的使用,
可以自己动手试一下。
有什么问题欢迎大家在评论区指出,一起相互交流学习。
如果这篇文章帮助到你,麻烦点个赞,留个关注,非常感谢大家们的支持~~~