C站能力认证(C4前端基础认证) //任务一:构建可访问性HTML实例

任务一:构建可访问性HTML实例


尝试将以下文本内容转化为`可访问性HTML`文档 **文档一**
李白(唐代诗人)
李白(701年—762年12月),字太白,号青莲居士,又号“谪仙人”,唐代伟大的浪漫主义诗人,被后人誉为“诗仙”,与杜甫并称为“李杜”,为了与另两位诗人李商隐与杜牧即“小李杜”区别,杜甫与李白又合称“大李杜”。
北京大学教授*敏评价:“李白之诗呼吸宇宙,出乎道;杜甫之诗德参天地,源于儒,皆至天人合一境界,故能出神入化。”   
《旧唐书》记载李白为山东人;《新唐书》记载,李白为兴圣皇帝李暠九世孙,与李唐诸王同宗。其人爽朗大方,爱饮酒作诗,喜交友。
 李白有《李太白集》传世,诗作中多以醉时写的,代表作有《望庐山瀑布》《行路难》《蜀道难》《将进酒》《明堂赋》《早发白帝城》等多首。李白所作词赋,宋人已有传记(如文莹《湘山野录》卷上),就其开创意义及艺术成就而言,“李白词”享有极为崇高的地位。

静夜思 明代版本

床前明月光,疑是地上霜。
举头望明月,低头思故乡。 

静夜思 宋代版本
床前看月光,疑是地上霜。
抬头望山月,低头思故乡。

望庐山瀑布二首
其一
西登香炉峰,南见瀑布水。
挂流三百丈,喷壑数十里。
欻如飞电来,隐若白虹起。
初惊河汉落,半洒云天里。
仰观势转雄,壮哉造化功。
海风吹不断,江月照还空。
空中乱潈射,左右洗青壁;
飞珠散轻霞,流沫沸穹石。
而我乐名山,对之心益闲;
无论漱琼液,还得洗尘颜。
且谐宿所好,永愿辞人间。

其二
日照香炉生紫烟,遥看瀑布挂前川。
飞流直下三千尺,疑是银河落九天。

文档二

杜甫 (唐代诗人) 
杜甫(712年2月12日-770年),字子美,自号少陵野老,唐代伟大的现实主义诗人,与李白合称“李杜”。出生于河南巩县,原籍湖北襄阳。  为了与另两位诗人李商隐与杜牧即“小李杜”区别,杜甫与李白又合称“大李杜”,杜甫也常被称为“老杜”。 
杜甫少年时代曾先后游历吴越和齐赵,其间曾赴洛阳应举不第。三十五岁以后,先在长安应试,落第;后来向皇帝献赋,向贵人投赠。官场不得志,目睹了唐朝上层社会的奢靡与社会危机。天宝十四载(755年),安史之乱爆发,潼关失守,杜甫先后辗转多地。乾元二年(759年)杜甫弃官入川,虽然躲避了战乱,生活相对安定,但仍然心系苍生,胸怀国事。杜甫创作了《登高》《春望》《北征》以及“三吏”、“三别”等名作。虽然杜甫是个现实主义诗人,但他也有狂放不羁的一面,从其名作《饮中八仙歌》不难看出杜甫的豪气干云。
杜甫的思想核心是仁政思想,他有“致君尧舜上,再使风俗淳”的宏伟抱负。杜甫虽然在世时名声并不显赫,但后来声名远播,对中国文学和日本文学都产生了深远的影响。杜甫共有约1500首诗歌被保留了下来,大多集于《杜工部集》。 
大历五年(770年)冬,病逝,享年五十九岁。杜甫在中国古典诗歌中的影响非常深远,被后人称为“诗圣”,他的诗被称为“诗史”。后世称其杜拾遗、杜工部,也称他杜少陵、杜草堂。

绝句四首(其一)
堂西长笋别开门,堑北行椒却背村。
梅熟许同朱老吃,松高拟对阮生论。
绝句四首(其二)
欲作鱼梁云复湍,因惊四月雨声寒。
青溪先有蛟龙窟,竹石如山不敢安。
绝句四首(其三)
两个黄鹂鸣翠柳,一行白鹭上青天。
窗含西岭千秋雪,门泊东吴万里船。
绝句四首(其四)
药条药甲润青青,色过棕亭入草亭。
苗满空山惭取誉,根居隙地怯成形。

** 注意:结合综上内容,要使用合适的语义化标签完成页面开发 **

C站能力认证(C4前端基础认证) //任务一:构建可访问性HTML实例


**提供的初始化代码结构**
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>李白</title>
    <style type="text/css">
    	body {
    		background: #e1e1e1;
    	}
    	</style>
</head>
<body>
	<header>
		<h1>唐代诗人精选</h1>
		<nav>
			<ul>
			</ul>
		</nav>
	</header>
	
	<main>
		<section class="box">
			<header> </header>
		</section>
		
		<section class="box">
			<header> </header>
		</section>
	</main>
	
	<footer>
		<p><small>&copy; 2021 CSDN-C.Tasking ...</small></p>
   </footer>
</body>
</html>

 
代码块:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>李白</title>
    <style type="text/css">
        body {
            background: #e1e1e1;
            font-family: sans-serif;
            font-weight: bold;
        }

        .box {
            margin: 0;
            padding: 0;
        }

        ul {
            list-style-type:none;
            margin: 0;
            padding: 1px 25px;
            overflow: hidden;
        }

        li {
            float:left;
            font-size: 16px;
        }

        li a {
            display: block;
            color: blue;
            padding: 0 12px;
            text-align: center;
        }

        p {
            width: 1918px;
            white-space: normal;
            padding: 0 30px;
            color: grey;
            font-size: 16px;
        }

        .para1 {
            margin: 0;
            padding: 0;
        }

        .para2 {
            margin: 10px;
            border: 10px;
            padding: 10px;
        }

    </style>
</head>
<body>
<header>
    <h1>唐代诗人精选</h1>
    <nav>
        <ul>
            <li><a href="#libai">李白</a></li>
            <li><a href="#dufu">杜甫</a></li>
            <li><a href="#">王维</a></li>
            <li><a href="#">白居易</a></li>
            <li><a href="#">李商隐</a></li>
            <li><a href="#">孟浩然</a></li>
        </ul>
    </nav>
</header>
<main>
    <a name="libai"></a>
    <section class="box">
        <header>
            <h2>李白  <small><small>(唐代诗人)</small></small></h2>
        </header>
        <div class="para1">
            <p>李白(701年—762年12月),字太白,号青莲居士,又号“谪仙人”,唐代伟大的浪漫主义诗人,被后人誉为“诗仙”,与杜甫并称为“李杜”,为了与另两位诗人李商隐与杜牧即“小李杜”区别,杜甫与李白又合称“大李杜”。</p>
            <p>北京大学教授*敏评价:“李白之诗呼吸宇宙,出乎道;杜甫之诗德参天地,源于儒,皆至天人合一境界,故能出神入化。”</p>
            <p>《旧唐书》记载李白为山东人;《新唐书》记载,李白为兴圣皇帝李暠九世孙,与李唐诸王同宗。其人爽朗大方,爱饮酒作诗,喜交友。</p>
            <p>李白有《李太白集》传世,诗作中多以醉时写的,代表作有《望庐山瀑布》《行路难》《蜀道难》《将进酒》《明堂赋》 《早发白帝城》等多首。李白所作词赋,宋人已有传记(如文莹《湘山野录》卷上),就其开创意义及艺术成就而言,“李白词”享有极为崇高的地位。</p>
        </div>
        <br/>
        <header>
            <div class="para2">
                <h2>静夜思 <small><small>(明代版本)</small></small></h2>
                <p>床前明月光,疑是地上霜。</p>
                <p>举头望明月,低头思故乡。</p>
            </div>
        </header>
        <br/>
        <header>
            <div class="para2">
                <h2>静夜思 <small><small>(宋代版本)</small></small></h2>
                <p>床前看月光,疑是地上霜。</p>
                <p>抬头望山月,低头思故乡。</p>
            </div>
        </header>
        <br/>
        <header>
            <div class="para2">
                <h2>望庐山瀑布 <small><small>(一)</small></small></h2>
                <p>西登香炉峰,南见瀑布水。</p>
                <p>挂流三百丈,喷壑数十里。</p>
                <p>欻如飞电来,隐若白虹起。</p>
                <p>初惊河汉落,半洒云天里。</p>
                <p>仰观势转雄,壮哉造化功。</p>
                <p>海风吹不断,江月照还空。</p>
                <p>空中乱潈射,左右洗青壁;</p>
                <p>飞珠散轻霞,流沫沸穹石。</p>
                <p>而我乐名山,对之心益闲;</p>
                <p>无论漱琼液,还得洗尘颜。</p>
                <p>且谐宿所好,永愿辞人间。</p>
            </div>
        </header>
        <br/>
        <header>
            <div class="para2">
                <h2>望庐山瀑布 <small><small>(二)</small></small></h2>
                <p>日照香炉生紫烟,遥看瀑布挂前川。</p>
                <p>飞流直下三千尺,疑是银河落九天。</p>
            </div>
        </header>
    </section>
    <br/>
    <hr width="1645px"/>
    <a name="dufu"></a>
    <section class="box">
        <header>
            <h2>杜甫 <small><small>(唐代诗人)</small></small></h2>
        </header>
        <div class="para1">
            <p>杜甫(712年2月12日-770年),字子美,自号少陵野老,唐代伟大的现实主义诗人,与李白合称“李杜”。出生于河南巩县,原籍湖北襄阳。为了与另两位诗人李商隐与杜牧即“小李杜”区别,杜甫与李白又合称“大李杜”,杜甫也常被称为“老杜”。</p>
            <p>杜甫少年时代曾先后游历吴越和齐赵,其间曾赴洛阳应举不第。三十五岁以后,先在长安应试,落第;后来向皇帝献赋,向贵人投赠。官场不得志,目睹了唐朝上层社会的奢靡与社会危机。天宝十四载(755年),安史之乱爆发,潼关失守,杜甫先后辗转多地。乾元二年(759年)杜甫弃官入川,虽然躲避了战乱,生活相对安定,但仍然心系苍生,胸怀国事。杜甫创作了《登高》《春望》《北征》以及“三吏”、“三别”等名作。虽然杜甫是个现实主义诗人,但他也有狂放不羁的一面,从其名作《饮中八仙歌》不难看出杜甫的豪气干云。</p>
            <p>杜甫的思想核心是仁政思想,他有“致君尧舜上,再使风俗淳”的宏伟抱负。杜甫虽然在世时名声并不显赫,但后来声名远播,对中国文学和日本文学都产生了深远的影响。杜甫共有约1500首诗歌被保留了下来,大多集于《杜工部集》。</p>
            <p>大历五年(770年)冬,病逝,享年五十九岁。杜甫在中国古典诗歌中的影响非常深远,被后人称为“诗圣”,他的诗被称为“诗史”。后世称其杜拾遗、杜工部,也称他杜少陵、杜草堂。</p>
        </div>
        <br/>
        <header>
            <div class="para2">
                <h2>绝句四首 <small><small>(一)</small></small></h2>
                <p>堂西长笋别开门,堑北行椒却背村。</p>
                <p>梅熟许同朱老吃,松高拟对阮生论。</p>
            </div>
        </header>
        <header>
            <div class="para2">
                <h2>绝句四首 <small><small>(二)</small></small></h2>
                <p>欲作鱼梁云复湍,因惊四月雨声寒。</p>
                <p>青溪先有蛟龙窟,竹石如山不敢安。</p>
            </div>
        </header>
        <header>
            <div class="para2">
                <h2>绝句四首 <small><small>(三)</small></small></h2>
                <p>两个黄鹂鸣翠柳,一行白鹭上青天。</p>
                <p>窗含西岭千秋雪,门泊东吴万里船。</p>
            </div>
        </header>
        <header>
            <div class="para2">
                <h2>绝句四首 <small><small>(四)</small></small></h2>
                <p>药条药甲润青青,色过棕亭入草亭。</p>
                <p>苗满空山惭取誉,根居隙地怯成形。</p>
            </div>
        </header>
    </section>
</main>
<br/>
<footer>
    <p><small>&copy; 2021 CSDN-C.Tasking ...</small></p>
</footer>
</body>
</html>

实现效果如下:
C站能力认证(C4前端基础认证) //任务一:构建可访问性HTML实例

上一篇:ASP.NET ValidationGroup 属性和CssClass 属性


下一篇:2021 年高教社杯全国大学生数学建模竞赛题目-B题