BIT前端训练营课（一）20211227 课：html基础

20211227 课：html基础

一、介绍了html常用标签

1.用<label>包裹住<input>，能实现点击文本也会有效果。

2.src和href

二、观鸟网

1.图片标签外面包裹了一层超链接标签，图片就是一个可点击的状态了。

2.语义化标签写网页： <header> <nav> <content> <aside> <footer>

3.语义化的好处：
1.利于搜索引擎SEO：搜索引擎会识别标签，爬虫会爬这些标签；
2.代码可读性好。

三、作业

1.html头部lang属性表示语言:

1. 简体中文页面：html lang=zh-cmn-Hans

2. 繁体中文页面：html lang=zh-cmn-Hant

3. 英语页面：html lang=en

2.<time datetime=“2019-2-22”>2019 年 2 月 22 日</time>
表示时间

3.<cite>表示引用</cite>

dl、dt、dd定义和用法
<dl> 标签定义了定义列表（definition list）。
<dl> 标签用于结合 <dt> （定义列表中的项目）和
 <dd> （描述列表中的项目）。

  <dl>
    <dt>波利尼西亚小鸡舞</dt>
    <dd>一种古老、神秘但影响广泛的舞蹈，可追溯至公元前 300 年，整个村庄围绕着一个小鸡形状的圈跳舞，祈祷牲畜肥美。</dd>
  <dl>

---

vh

vh就是当前屏幕可见高度的1%，也就是说
height:100vh == height:100%;
但是有个好处是当元素没有内容时候，设置height:100%该元素不会被撑开，但是设置height:100vh，该元素会被撑开屏幕高度一致

em

在做手机端的时候经常会用到的做字体的尺寸单位
em就相当于“倍”，比如设置当前的div的字体大小为1.5em，则当前的div的字体大小为：当前div继承的字体大小*1.5
但是当div进行嵌套的时候，em始终是按照当前div继承的字体大小来缩放，参照后面的例子.

vw

vw就是当前屏幕宽度的1% 补充一句，当设置width:100%，被设置元素的宽度是按照父元素的宽度来设置，
但是100vw是相对于屏幕可见宽度来设置的，所以会出现50vw 比50%大的情况

rem

（font size of the root element）是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。
看到rem大家一定会想起em单位，em（font size of the element）是指相对于父元素的字体大小的单位。