批改状态:合格
老师批语:完成的不错,整理排版看上去很舒服,继续加油
<!-- 1. 文档类型元素 --><!DOCTYPE html><!-- 2. 根元素: 浏览器渲染html的起点,入口 --><!-- 键(lang),值(zh-CN),是语言是中文的意思 --><html lang="zh-CN"><!-- 2.1 头元素: 浏览器, 搜索引擎SEO--><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>html结构</title><!-- 页面主体 --><body><h1>这是大标题的样式</h1></body></head></html>
tag + class 目前是主流
布局一般包含页眉、正文和页脚三个板块
页眉一般使用header、正文一般使用main、页脚一般使用footer表示
<!-- 传统 div + id --><div id="header">页眉</div><div id="main">主体</div><div id="footer">页脚</div><!-- # : 表示 id,输入div#header{页头} 后按Tab键--><!-- 得到<div id="header">页头</div> --><!-- 语义化 --><header>页眉</header><main>主体</main><footer>页脚</footer><!-- 标签权重更低更好,一目了然,直观 -->
<!-- 但ID的唯一性不能被浏览器保证,只能由自己来保证,权重过高。 而且语义化标签,数量有限,且会导致元素的层级过深 -->
<!-- 优化: 但 tag + class 目前是主流 --><div class="header">页眉</div><div class="main">主体</div><div class="footer">页脚</div><!-- emmet: . 表示class,默认标签就是div,可不写 --><!-- .header{页头} --><!-- <div class="header">xxxx</div> --><!-- class权重要小于id -->
演示图文一般包含两种解决方案,一种是利用div的传统标签,另一种是使用figure语义化标签,figure可创建带标题的内容,而div操作起来比较麻烦
<!-- 语义化 --><!-- figure: 创建带有标题的内容 --><figure><!-- 图片 --><a href=""><img src="https://img.php.cn/upload/course/000/000/068/6396fa6140e14800.png" alt="" /></a><!-- 文字 --><figcaption>第二十二期</figcaption></figure>
<img src="图像地址" alt="图像的名称" width="图像的宽度" />
<a href="链接地址" target="打开窗口的方式">链接文本</a><!--提示: "链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。 如图像链接,锚点链接,空链接,图像热区链接,E-mail链接,JavaScript链接等--><!--通过按钮访问--><a href="链接地址" target="_blank"><button>按钮文本</button></a><!--通过图片点击--><a a href="链接地址" target="_blank"><img src="图像地址" alt="图像名称"/>/a>
HTML 支持有序、无序和自定义列表。
<!-- 有序 ol+li --><ol><li>列表1</li><li>列表2</li><li>列表3</li></ol>
<!-- 无序 ul+li --><ul><li>列表1</li><li>列表2</li><li>列表3</li></ul>
<!-- 自定义列表: 由dl、dt、dd三部分组成,一般用在多级菜单, 友情链接, 关于我们等方向 --><dl><!-- 标题 --><dt>第一课</dt><!-- 内容描述 --><dd>结构化标记语言</dd></dl>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号