一、HTML基本标签
图像标签<img src="图像的路径"alt="提示文字"width="图像宽的像素(px)"height=“图像宽的像素(px)”>
名称 | 标签 | 示例 |
标题标签 | <h1>~<h2>~~<h6> | <h1>静夜思</h1> |
断落和换行标签 | <p>~~~</p>、<br/> | <p>床前明月光<br/>疑是地上霜</p> br强制换行 |
水平线标签 | <hr/> | <hr/> |
斜体 | <em>~~~</em> | <em>举头望明月</em> |
字体加粗 | <strong>~~~</strong> | <strong>低头思故乡</strong> |
还有:
自动刷新本页面 | <meta http-equiv="refresh" content="30"> |
将一段文本中的“代码”部分作区别于文本其他部分的显示 | <code> <pre>标签,与<code>主要搭配使用。 |
二、HTML的注释和特殊符号
特殊符号 | 字符实体 | 实例 |
空格 | | <a href="#">百度</a> 注意不能少了末尾的分号 |
大于号(>) | > | 如果时间>晚上6点,就坐车回家 |
小于号(<) | < | 如果时间<早上7点,就走路去上学 |
引号(") | " | W3C规范中,HTML的属性值必须用成对的"引起来 |
版权符号@ | © | ©2003-2013北大青鸟 |
三、HTML5的媒体元素
1、视频元素
<video src="视频路径" controls> </video> (浏览器可能不支持)
(controls:提供播放、暂停和音量的控件;autoplay:自动播放)
<video controls autoplay>
<source src="视频路径.mp4" type="类型说明"/>
<source src="视频路径.webm" type="类型说明"/>
</video>
2、音频元素
(controls:提供播放、暂停和音量的控件;autoplay:自动播放)
<audeo controls>
<source src="音频路径.mp3" type="audeo/mpeg"/>
<source src="音频路径.ogg" type="audeo/ogg"/>
</audeo>
四、HTML5的结构元素
元素名 | 描述 |
header | 标题头部区域的内容(用于页面或页面中的一块区域) |
footer | 标记脚部区域的内容(用于整个页面或页面的一块区域) |
section | Web页面中的一块独立区域 |
article | 独立的文章内容 |
aside | 相关内容或应用(常用于侧边栏) |
nav | 导航类辅助内容 |
五、CSS选择器
5.1 内联样式表
<style>.......</style>
(注:一般在头部head范围内定义style来设置下面的格式)
(CSS注释:/* */)
1)标签选择器
<style>
h1{ //标签
font-size:20px; //属性,值
color:red;
}
</style>
使用:<h1>床前明月光</h1> :直接引用
2)类选择器
<style>
.red{ //创建一个类选择器
color:blue;
}
</style>
使用: <h1 class="red">床前明月光</h1> :标签后调用类名可引用, 可重复引用
3)ID选择器
<style>
#greed { //创建一个ID选择器
color:greed;
}
</style>
使用: <p id="greed">床前明月光</p> :标签后调用ID名可引用 但ID必须唯一,不能重复
<p style="color=yellow;">文本内容</p>
5.2 外部样式表
在外部创建一个css文件,把样式在头部head范围内导入到这个文件中
<link rel="stylesheet" href="该样式文件路径"/>
在页面前加载
5.3 导入样式表
import,在页面后加载
有些浏览器不支持,不常用。
六、超链接
1.几个页面之间的跳转:
<a href="链接地址的路径" target="目标窗口位置">文本或图像</a>
(注:target=“_self”在自身窗口内 或 target=“_blank”新建窗口打开)
2.锚链接:
1) 跳转到同一个页面的固定位置
<a href="#me" >文本</a>
<a name="me" >文本</a> (注:给标签一个代号标记,即命名)
2) 跳转到不同页面:
<a href="2.html#me" >文本</a><a name="me" >文本</a> (注:给标签一个代号标记,即命名)
3.功能连接:
<a href="mailto:邮箱地址" >写信</a>