html5复习一
目标
1、html5介绍及开发工具
2、html5标签
3、文本样式
4、图片标签和超链接标签
知识点:
万维网的构成:
1、url:统一资源定位器
2、http/https:超文本传输协议
3、html:超文本标记语言
html的后缀名:
.html 和 .htm
html基本标准结构:
<html> --html文档标签
<head> --html文档头部标签
<meta charset="utf-8" /> --声明文档字符编码语言 utf-8/gbk/gb2312
<title>第一个练习</title> --html文档标题
</head>
<body> --html文档主体
我要显示正文内容
</body>
</html>
html的注释
<!-- 注释的内容 --> ctrl+/ 注释内容不会被浏览器解析,用作标记
标题标签
<h1 align="对齐方式">~<h6> 数字越大字体越小 独占一行
align="" 对齐方式的属性 left 左/center 中/right 右
段落标签
<p align="" title="" style="">文本</p>
align:对齐方式
style:内嵌样式 <p style="text-indent: 2em;"></p> 首行缩进2个字符
title:提示信息
字体标签
<font face="" color="" size="">文本</font>
face:字体 微软雅黑
color:颜色 16进制#ff0000 / 英文单词 red
size:字体大小 数值越大字体越大 1-7
换行标签
<br/> 单标签
水平线标签(单标签)
<hr width="100px" size="5px" noshade="noshade" color="green"/>
width:宽度 像素作为单位/百分比
size:水平线的粗细 像素作单位
noshade:去除阴影 当没有颜色值设置时,设置才有效
color:水平线颜色
<hr/>默认值:为宽度为100%,颜色为灰色镂空有阴影的直线
特殊符号:
< <
> >
空格
© 版权符号©
图片标签
<img src="img/libai.jpg" width="200px" height="300px"
border="3" title="这是一个帅气的诗人" align="center" alt=""/>
src:图片的地址 相对路径和绝对路径
width:宽度
height:高度
border:边框 数字大小
title:鼠标浮动至图片提示信息
align:对齐方式 左对齐left/右对齐right/上对齐 top /居中对齐 middle /底部对齐bottom
alt:图片没有找到时显示的文本信息
相对路径/绝对路径
相对路径: ../ 表示上一级 存在项目的路径下,相对本文件所在的位置填写路径
绝对路径:1、网络图片,带http:// url 2、带盘符路径 弊端 :不方便项目迁移
超链接标签
1、
<a href="http://www.baidu.com" target=""></a>
<a href="../index2.html" target=""></a>
href:设置连接地址
target:打开方式 _self当前窗口打开/_blank 新窗口打开/_parent 父级窗口打开(框架)/_top 顶级窗口打开(框架)
2、锚点
(在同一个页面中,回到顶层)
<a href="#名字"></a> 定义点击位置
<a name="名字"></a> 定义需要回到页面的指定位置