Design a static page according to the requirements of the figure below!

<!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>
        .imgNav{
     
     
            padding-left: 50px;
        }
        .pNav{
     
     
            display: block;
            padding-left: 100px;
        }
        .thin th{
     
     
            font-weight: 500;
        }
            
        
        
    </style>
</head>
 <body>
    <h1>按照下图要求设计静态页面!</h1>    
    <br>
        <p class="pNav">LOG图片</p>
    <br>
    <hr/>
    <ul>    
        <li><a href="#">科技</a></li>
        <li><a href="#">农业</a></li>
        <li><a href="#">健康</a></li>
        <li><a href="#">教育</a></li>
        <li><a href="#">经济</a></li>
        <li><a href="#">社会</a></li>
        
     </ul>
    <h2>科研人员制造噪音来研究安静的价值</h2>
    <div class="imgNav">
        <img src="./timg.jpg" alt="研究"  height="200px">
    </div>
    
    
    <p>秋风用时光的旋律,用桂花的芬芳、苹果的馨香、菊花的灿烂、牵牛花的奔放、一串红的艳丽,
        把一望无际的田野乡村,演绎得在自然中沉醉,渲染得天地间空旷而又阳刚。</p>

  <p>酷热的夏天刚刚过去,秋风吹来,秋牵着一个个节气的手,舞动着长袖,用婀娜多姿的舞姿,
      用变幻神奇的旋律,动听的音符,把蓝天吹得一会白云飘飘,一会云蒸霞蔚,一会仙女舞袖,一会又涌来千顷碧波。
      更让那成千上万得雀鸟,不顾辛苦劳顿,路途遥远,赶赴银汉,为牛郎织女架起一座相会的鹊桥,就为这对生离死别的鸳鸯说上一晚悄悄话。</p>

    <p> 秋天的风,优雅中体现成熟和高雅。
        砍高粱、掐谷子、掰玉米、刨芋头、割豆子、下苹果、晒柿子、揪石榴、摘花生、耩麦子,一个个音符,无不让秋风演奏得动听、感人。
        仰望湛蓝的长空,会让你一扫往日沉闷枯燥的苦闷,心情更加舒畅了,一股热爱蓝天热爱大自然钟爱乡村田野的激情,便油然而生。</p> 

  <p>秋风是多情的。花朵变得更加缤纷多彩,路边山间公园各种小花,一夜之间便把一片片一处处山川河流吹得五颜六色,
      吹得诗意盎然,吹得舒展酣畅。连多情的小鸟也不愿在花丛打滚,嘴馋的小羊也不忍心张口去啃。特别是那漫山遍野的山丹丹花,
      把天空的云彩的染得霞光满天。阵阵清香,优雅而芬芳,把那躲在暗处的萤火虫,引得打着灯笼,在山野荒原中游来游去。特别是那一株株菊花,
      顶住尘土的飞扬,忍得住周边花朵凋谢的寂寞,耐得住干旱的折磨,在秋风中不顾寂寞和冷落暗自开放。</p> 

  <p>秋风是煽情的。秋风在田野打一个滚,哪一树树青涩碧绿的苹果,一层层红晕铺在脸颊上,
      变得又香又甜。一树树大枣、山楂就像神仙点化了一样,一个个像红宝石,缀满树头,压弯枝头,甜满心头,
      让路人看了都垂涎欲滴。最可爱的是那山坡上的柿子,圆晕金黄,一个个像灯笼挂满树梢,引得小鸟满树鸣叫。</p>

  <p>秋风是有魅力的。秋风掠过满眼绿色,霎时就会变得金黄,金色的谷穗压弯了枝头,满坡玉米竖起一杆杆摇曳的旗子,
      露出一排排整齐的金牙。乡间道路上一车车黄豆、花生透出诱人的馨香。正在收获庄稼的乡亲,艰苦的付出得到了加倍的回报,
      紫铜的脸上添了少有的红润,露出了笑容。大树仿佛一夜之间都变得金黄,满树的银杏叶、哗啦啦的杨树叶金光闪闪,静美而耀眼。似乎是一夜之间,
      漫山遍野的绿色都变成了满眼金黄,演奏起金黄色的乐章。</p> 

  <p>秋风是幽静的。秋风吹过,山野田园,变得贤淑幽静起来,没有阳春的怒放,盛夏的狂热,
      活跃在林子里、小河旁、山榜上的鸟儿,没了浮躁,唱得更加婉转悠扬。流过树根,淌过石块的小溪,不在狂奔湍急,
      像少女摆动的轻纱,舒缓而宁静。“天阶夜色凉如水,坐看牛郎织女星。”秋风揉圆了那一轮轮月亮,把思恋的洞箫吹奏得揪心荡肠,
      吹得每每昂起头来,一遍遍对着玉盘倾诉心中的珍藏。</p> 

  <p>人生的秋季,何尝又不是这样呢?到了我们这样的年龄,已经步入了人生的秋季,虽然没了青春的靓丽,
      却多了成熟的韵味。“夜半酒醒人未醒,满池荷叶动秋风”。荡漾在秋风中,静听天籁之声,虽未喝酒人却醉了。</p>  
    <br/>
    
    <table width="400" border="1px">
        <caption>噪声测试表</caption>
        
            <tr>
                <th rowspan="2">地点</th>
                <th rowspan="2">噪声</th>
                <th colspan="2">测试</th></tr>
            <tr >
                <th>动物种类</th>
                <th>影响大小1-10</th>
            </tr>
            <tr class="thin">
                <th rowspan="4">小河旁</th>
                <th rowspan="2">采集天然气的机器声</th>
                <th style="text-align: left;">鸟类</th>
                <th style="text-align: left;">8</th>
            </tr>
            <tr class="thin">
                <th style="text-align: left;">昆虫</th>
                <th style="text-align: left;">3</th>
            </tr>
            <tr class="thin">
                <th rowspan="2">汽车过往的声音</th>
                <th style="text-align: left;">鸟类</th>
                <th style="text-align: left;">6</th>
            </tr>
            <tr class="thin">
                <th style="text-align: left;">昆虫</th>
                <th style="text-align: left;">2</th>
            </tr>
            <tr class="thin">
                <th rowspan="4">高山旁</th>
                <th rowspan="2">采集天然气的机器声</th>
                <th style="text-align: left;">鸟类</th>
                <th style="text-align: left;">9</th>
            </tr>
            <tr class="thin">
                <th style="text-align: left;">昆虫</th>
                <th style="text-align: left;">4</th>
            </tr>
            <tr class="thin">
                <th rowspan="2">汽车过往的声音</th>
                <th style="text-align: left;">鸟类</th>
                <th style="text-align: left;">4</th>
            </tr>
            <tr class="thin">
                <th style="text-align: left;">昆虫</th>
                <th style="text-align: left;">1</th>
            </tr>
            <tr>
                <th colspan="4">
                    *此表格数据纯属虚构
                </th>
            </tr>

    
        
        
    </table>
        
   
</body>
</html>

Guess you like

Origin blog.csdn.net/lmhnba/article/details/108800994