<!DOCTYPE html> <!-- 声明文档类型是html -->
<html> <!-- 页面中最大最外层标签-根标签 -->
<head> <!-- 网页头部 ,主要给浏览器-->
元标签 <meta charset="UTF-8" /> <!-- 给浏览器指定字符集,页面编码 -->
<title>网页标题</title> <!-- 标题标签-窗口标签显示 -->
</head>
<body> <!-- 主题标签-浏览器显示区域 -->
</body>
</html>
HTML标签
<img src="图片路径"/><br />属性名="属性值"--键值对语法
图片标签
<br />title-图片标题
<br />alt-图片描述
单标签
<br />title(悬停显示)
<br />alt(失败显示)
<a href="#">点击的内容_点击后不跳转</a>
<a href="###">点击的内容_点击后不跳转</a>
<a href="javascript:;">点击的内<a href="#">点击的内容_点击后不跳转</a>
<a href="javascript:void(0);">点击的内容_点击后不跳转</a>
<a href="协议线上完整网址" target="_blank">提示内容点击的内容</a>
双标签,增加网站的语义化 从而提升搜索引擎对网站的排名
<form action="" method="">表单域里的内容
</form>
收集用户数据form,通过某种方式method(get明文;post加密),将数据提交到后台程序action
文字内容能够显示<br />提示内容--placeholder属性
<input type="password" />
<input type="radio" name="xb" /><br /><input type="radio" name="xb" />
每个单选按钮设置相同name属性值<br />默认选中-checked="checked"
<input type="checkbox" />
可以全选,选一部分<br />默认选中-checked="checked"
<select> <br />
<option>选项1</option><br />
<option>选项2</option><br />
</select >
select--下拉框<br />option--下拉选项<br />注意下拉框中选项的数量和顺序<br />默认选中-selected="selected"
<textarea rows="行数" cols="列数"> </textarea>
通常大小通过CSS设置<br />
不用rows和cols <br />
禁用大小拖拽-resize:none(在style里面用CSS选择器设置);
<input type="button" value="提示"/>
文字通过value属性设置<br />普通按钮效果通过js实现
<input type="reset" value="提示"/>
设置value属性<br />若不设置value,浏览器会写入一个默认值,会产生默认内容兼容问题,(效果是重置数据而非清空)
<input type="submit" value="提示"/>
提交表单数据到action指定的后台程序<br />设置value属性
<label for="目标元素id值">点击的内容</label>
for属性="目标元素id值"<br />目标元素需要有id属性
<datalist id="dl">
<option>1</option>
<option>2</option>
<option>3</option>
</datalist>
数据列表
Option的value属性要么就不写,要么写了之后就和option里面的内容保持一致,因为不同浏览器显示的效果不一样
关联数据列表和文本框
<input type="text" list="dl"/>
<input type="text" required="required"/>
<input type="text" autofocus="autofocus"/>
<input type="text" autocomplete="on" name="test"/>
<input type="datetime-local" />
-- 单个音频
<audio src="yinyue.mp3" controls="controls" autoplay="autoplay" loop="loop"></audio>
src--文件路径
controls--播放控制栏
autoplay--自动播放
loop--重复循环播放
source标签--加载音乐文件
-- 多个音频
<audio controls="controls" autoplay="autoplay" loop="loop">
<source src="yinyue.mp3"></source>
<source src="yinyue.ogg"></source>
</audio>
<video width="800" controls="controls" loop="loop" autoplay="autoplay">
<source src="movie.mp4" type="video/mp4"></source>
<source src="movie.ogg" type="video/ogg"></source>
<source src="movie.webm" type="video/webm"></source>
当前浏览器不支持 video直接播放,点击这里下载视频: <a href="movie.mp4">下载视频</a>
</video>
controls--播放控制栏
autoplay--自动播放
loop--重复循环播放
<a href="myvideo.webm">下载视频</a>--当视频无法加载时才会显示
<ul>
<li></li>
<li></li>
<li></li>
</ul>
<ol>
<li></li>
<li></li>
<li></li>
</ol>