1.
HTML 全名：HyperText Markup Language
是一种超文本标记语言，该语言书写的代码通常会被浏览器解析执行，用于定义文档的内容结构
2.
HTML的注释书写格式：<!--注释内容-->
HTML的注释主要用于描述代码功能
3.HTML元素是HTML文档的重要组成部分
表示元素的开始：起始标记、元素内容、结束标记【<h3>元素内容</h3>】
标记也可以叫做元素、标签
所有元素都有属性
4.
a标记：表示这是一个超链接
书写格式：<a href =“/classroom/17”>立即加入</a>
⑴元素内容：表示在页面上显示立即加入
⑵href属性：表示用户点击它后，会跳转到/classroom/17
5.
img元素没有元素内容和结束标记，类似于这种元素，称之为：空元素、自闭合元素
空元素书写方式：<标记名 属性>
<标记名 属性/>
6.元素的层次结构：一个元素的内容中可以包含其他元素，形成嵌套的层次结构，但两个元素之间不能互相嵌套
7.
文档声明既不是元素，也不是注释，它总是出现在HTML代码的第一行
书写代码：<!DOCTYPE html>
8.html元素又叫做根标记、根元素，它是所有其他元素的祖先元素，文档中所有其他元素，都必须放置在它的元素内容中
9.相关属性：lang
该属性指定文档中的文字是用何种自然语言书写的
该属性可能会影响浏览器的语音阅读和翻译行为
10.
head元素又叫做文档头，它是html元素的第一个子元素
文档头中可以包含一些其他元素，用于描述页面的附加信息（head元素中的内容不会显示到页面上）
head元素中通常包含以下元素：
<title>标识文档标题，该标题会显示在浏览器的标题栏或者标签页上
<meta>标识页面的其他元数据（页面相关的附加信息），这是一个空元素
示例：<meta charset ="UTF-8">
指示浏览器，使用字符编码集UTF-8解析页面
为了获得更好的地域兼容性，避免乱码，应将字符编码集设置为UTF-8，并且将该代码作为head的第一个子元素
11.body元素又叫做文档体，网页中所有的可见内容都放置在该元素内
12.元素标签：
<ul>→<li>（无序）
<ol>→<li>（有序）
<dl>→<dd>、<dt>（自定义）
<p>（段落标签）
<pre>（预格式文本）→作用：还原所输内容
<q>（小段引用）
<blockquote>（大段引用）
<span>（跨越多个字符和文字）
<b>、<strong>（字体加粗）
<em>、<i>（斜体）
<figure>（标识插图）
<figcaption>（对图片的描述）
<br>（换行）
<hr>（分割线）
<div>（划分页面区块）
<hgroup>（对网页或区段的标题元素{h1-h6}进行组合）
13.特殊字符：
<；表示小于号
>；表示大于号
&nusp；空格
①版权符号：©；
②已注册符号：®；
③&符号：&；
14.
下标：0<sub>2</sub> 上标：X<sup>2</sup>
简写-全称写在title属性中：<abbr title="HyperText Markup Language">HTML</abbr>
日期标签、时间标签：<time datetime="2017-09-28">情人节</time>
插入图片：<img src="../dm_pic01.jpg" alt="01tupian">
音频、视频：<video src="../../imges/movie.mp4" ></video>
controls音频、视频播放插件和按钮：<audio src="../../imges/baluoke.wav" controls></audio>
改变字体颜色：<span style="color:red;">账号</span>
输入框：
账号：<input type="text">
密码：<input type="password">
单选框：（兴趣）
<input type="radio" name="xingqu" value="sheying">摄影
<input type="radio" name="xingqu" value="LOL">LOL
多选框：（爱好）
<input type="checkbox" name="aihao">打豆豆
<input type="checkbox" name="aihao">吃火锅
多行文本框 （cols代表列，rows代表行）：<textarea name=" " id=" " cols="30" rows="10"></textarea>
下拉列表、下拉框：（省份）
<select name="shengfen">
<option value="sichuan">四川省</option>
<option value="hubei">湖北省</option>
</select>
输入框提示信息：
①邮箱：<input type="text" placeholder="请输入你的邮箱">
②<input type="text" list="F44list">
<datalist id="F44list">
<option value="kevin"></option>
<option value="polo"></option>
<option value="magie"></option>
<option value="Jack"></option>
</datalist>
收缩框：
<details>
<summary>
点我有惊喜
</summary>
<p>hahahahahahaha，被骗了</p>
</details>
表格：
<table border="1">
<tr>
<td>1-1</td>
<td>1-2</td>
<td>1-3</td>
</tr>
<tr>
<td>2-1</td>
<td>2-2</td>
<td>2-3</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
<td>3-3</td>
</tr>
</table>
按钮：
<input type="button" value="haha">（普通按钮）
<input type="submit">（提交按钮）
<input type="reset">（重置按钮）
表单：（action提交地址，method提交方式get/post）
<form action="#" method="get">
账号：<input type="text" name="username">
密码：<input type="password" name="pwd">
<input type="submit">
<input type="reset">
</form>
设置文本框文本长度：<input type="text" maxlength="11">（最多输入11位数字）
添加日历插件选择： 年月日：<input type="date">
数值型输入框（min最小值/起始值、max最大值、value默认值、step差值）： 身高：<input type="number" min="150" max="200" step="50" value="160">
滚动条选择： 体重：<input type="range" min="10" max="100" name="weight">
颜色选择： 喜欢的颜色：<input type="color" name="color">
15.语义化结构元素：
<header>用于表示页面或某个区域的头部
<nav>用于表示导航栏
<aside>用于表示跟周围主题相关的附加信息
<article>用于表示文章或其他
<section>用于表示一个整体的一部分主题
<footer>用于表示页面或某个区域的脚注
16.
绝对路径：访问站外资源，书写格式：协议//域名/目录
相对路径：访问站内资源，书写格式：./路径
posted on
2017-10-08 15:53
张萤莹
阅读(
934)
评论()
收藏
举报
浙公网安备 33010602011771号