select:下拉菜单
下拉菜单整体:select标签 name
每一项: option标签 value
属性:
1、默认选中:selected 一个select标签中只能设置一个(规范)
出生年月:
<select name="" id="">
<option value="">1998</option>
<option value="">1999</option>
<option value="">2000</option>
<option value="" selected>2001</option>
<option value="">2002</option>
</select>
文本域标签:textarea
作用:用于输入大段文字
属性:
1、cols:规定文本区内的可见宽度。
2、rows:规定文本区内的可见行数。
<textarea name="" id="" cols="10" rows="10"></textarea>
label标签:
作用:把文字和表单标签绑定起来!
方式一(推荐使用):
1、先用label标签把文字包裹起来
2、在表单标签上添加一个id属性
3、在label标签的for属性中 写表单标签的id属性值
方式二(简单粗暴):
直接用label标签把文字和表单标签一起包裹起来
注意点:需要把label标签上的for属性删除掉!!!!
-->
性别:<input type="radio" name="sex" id="man"><label for="man">男</label>
<label><input type="radio" name="sex">女</label><br><br>
爱好:<input type="checkbox" id="code"><label for="code">敲代码</label>
没有语义的标签:
div:没有语义
显示的特点:
1、宽度默认占满一行!!!
2、高度默认由内容撑开(自适应)
3、独占一行(一行中只能显示一个)
span:没有语义
显示的特点
1、一行可以显示多个
2、宽度和高度都是由内容撑开的(自适应)
-->
<span>燃烧我的卡路里</span>
<span>保温杯里泡枸杞</span>
<div>燃烧燃烧把我的心燃烧</div><div>不再流泪哦不再流泪</div>
新增语义标签:
header标签:表示网页头部的语义
显示的特点:和div一样
header = div + 网页头部的语义
nav标签:表示网页的导航的语义
nav= div + 网页导航的语义
footer标签:表示网页底部的语义
footer = div + 网页底部的语义
<header>网页头部</header>
<nav>网页导航</nav>
<footer>网页底部</footer>
<footer>长亭外</footer>
<footer>古道边</footer>
新增表单属性:
1、placeholder:占位符
作用:提示用户输入什么信息
2、autofocus:自动获取焦点,即不点击鼠标自动闪烁
3、multiple:多文件上传
昵称:<input type="text" placeholder="请输入用户名" autofocus ><br><br>
<input type="file" multiple>
音频标签:audio
属性:
1、src:音频的路径
2、controls:音频播放的控件(必加)
3、autoplay:自动播放(有兼容性问题)
4、loop:循环播放(有兼容性问题)
<audio src="1.mp3" controls autoplay loop></audio>
<!--
兼容性处理:告诉老版本的浏览器的用户电脑的浏览器版本太低了!!去下载最新的浏览器
-->
<audio controls autoplay loop>
<source src="1.mp3">
<a href="http://www.itcast.cn">您的浏览器太垃圾了!!!请下载最新的版本!!</a>
</audio>
视频标签:video
属性:
1、src:视频的路径
2、controls:视频的控件
3、loop:循环播放(有兼容性问题)
4、autoplay:自动播放(有兼容性问题)
<!-- <video src="1.mp4" controls loop autoplay></video> -->
<!--
兼容性处理:告诉老版本的浏览器的用户电脑的浏览器版本太低了!!去下载最新的浏览器
-->
<video controls autoplay loop>
<source src="1.mp4">
<a href="http://www.itcast.cn">您的浏览器太垃圾了!!!请下载最新的版本!!</a>
</video>