HTML初步认识

来源：互联网发布：.win域名微信打开编辑：程序博客网时间：2024/06/15 15:04

2017/8/15

HTML的基本结构

<!-- 注意：在基本结构上方通常会有<!doctype html>，该句话的作用是确定文档类型声明，就是告诉浏览器该网页是遵照哪个版本的HTML书写 --><html>*    <head>        <title>网页标题</title>        <meta  charset=”utf-8”/>    </head>    <body>        <!--  代码正文  -->    </body></html>

HTML的常用标签

1.p标签

    <p>Hello!</p>

作用 : 在页面中创建段落
属性 : align ;作用是设置段落的对齐方式:属性值:left、center、right；

2.标题标签

    <h1>这是标题 1</h1>    <h2>这是标题 2</h2>    <h3>这是标题 3</h3>    <h4>这是标题 4</h4>    <h5>这是标题 5</h5>    <h6>这是标题 6</h6>    <!--注意：h1字号最大，h6字号最小，所有标题都具有加粗效果。六组标题重要性递减，浏览器对h1最为敏感-->

3.换行br标签

    <h1>这是标题 1</h1><br>    <h2>这是标题 2</h2><br>    <h3>这是标题 3</h3>    <!--<br> 可插入一个简单的换行符。<br> 标签是空标签（意味着它没有结束标签，因此这是错误的：<br></br>）。在 XHTML 中，把结束标签放在开始标签中，也就是 <br />。-->

4.图像标签img

        <img src="图片存放路径" alt="规定图像的替代文本。（图片未加载显示内容）">

作用：在页面中插入图像
导致图片无法正常加载：①路径错误； ②网络原因；

路径：相对路径、决定路径

相对路径：是指文件间的相对的位置关系，包含如下三种情况：
①网页和图片在一个文件夹下，路径为图片的名字，
<img src=”pic.jpg”>
②网页在文件夹里面，图片在文件夹外面，路径为先跳出文件夹，然后写图片名，如
<img src=”../pic.jpg”>
③网页在文件夹外面，图片在文件夹里面，路径为先进入文件夹，然后写图片名，如
<img src=”a/pic.jpg”>
绝对路径 ：指文件在磁盘中的具体位置，绝对路径是从盘符或协议开始写的路径，如
<img src="file:\\\C:\Users\SSNH\Desktop\day1\pic.jpg" alt="图片1">

5.文本加粗标签
加粗文本
作用修饰文本加粗效果

6.文本倾斜标签
倾斜文本
倾斜文本
作用修饰文本倾斜效果

7.文本上下标签
修饰文本下标：该效果可写出氧气
O2
修饰文本上标：可写出平方
O2

8.span标签
内容1内容2
作用是将一行文本划分成不同的部分，方便用CSS进行修饰，无实质效果

9.a标签
<a href="" target="" title=""></a>

属性：

href：设置链接目标文件的路径 target：设置目标文件的打开方式，属性值为_self或_blank
- _self：默认，在自身窗口打开目标文件
- _blank：在新窗口中打开目标文件
title：设置鼠标悬停在超链接上时的提示文字

超链接的应用对象：文本、图片

文本：默认情况下文字变为蓝色，且有下划线，当鼠标移到上面的时候显示为一只手
图片：在IE浏览器下具有超链接的图片会有边框，使用border=0来去掉边框

超链接的种类

内部链接：所谓内部链接就是指同一网站内部各文件间的链接，需要注意该href的值为相对路径
外部链接：所谓外部链接就是指网站间各文件的相互链接，需要注意href的值为绝对路径，如
- <a href="http://www.baidu.com">百度首页</a>
 可连接到百度首页
- 空链接：所谓空链接就是指具有链接效果，但是没有链接指向，href的值为#
- 锚点链接：所谓锚点路径就是一个文档内部各部分间的链接，锚点链接的使用需要分为两步
 - 第一步：设置锚点： <开始标签 id=”锚点名”></结束标签>
 - 第二步：链接锚点： <a href=”#锚点名”></a>

2017年8月15日20:45:36

阅读全文

1 0