html5复习一

news2024/11/20 14:59:42

目标
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> 定义需要回到页面的指定位置

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2244098.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！