html笔记 标签属性、图像和连接、超连接

HTML 标签属性：

<b></b>:加粗

<i></i>:斜体

<u></u>:下划线

<s></s>:删除线

:上标

:下标

<b>加粗</b>

<i>斜体</i>

<u>下划线</u>

<s>删除线</s>

^上标

_下标

<h1>一级标题</h1>

<h2>二级标题</h2>

<h3>三级标题</h3>

属性:文本的水平对齐方式

取值 ：left、center、right

<p></p>

属性:align:left、center、right

demo

<p align="right">the first paragraph</p>

<p>the second paragraph</p>

分割线

做用：在页面中表现为一条直线

语法：<hr>

属性：

size 尺寸 以px为单位

width宽度 以px或%为单位

align 水平对齐方式

color 颜色

demo

<p><hr size="5px" width="50%" align="center" color="red"></p>

分区元素

块分区元素

语法：<div></div> 布局

行内分区元素

语法：<span></span>设置同一行文字内的不一样样式

demo

<div>鹅鹅鹅</div>

<div>鹅鹅鹅</div>

<span>鹅鹅鹅</span>

<span>鹅鹅鹅</span>

行内元素 与 块级元素

按照元素们的表现形式来分类，分为行内元素和块级元素

行内元素：在一行 内容许显示多个元素的，叫行内元素 span,i,b,s,u,sup,

做用：包裹文本，并处理文本的形式

块级元素：每一个元素独占一行显示的，叫级元素 div,p,<h1>,h1,h2,h3

做用：布局

注意

一、p标记不能嵌套其余的块级元素

二、行内元素中最好不要嵌套块级元素

 

图像和连接

一、URL

目录结构：目录，保存文件的文件夹名称

什么是URL（uniform resource locator）统一资源定位器 用来标识资源文件的位置

一、URL在wed中的表现形式

一、绝对路径：从文件的最高级目录处开始查找资源文件所结过的路径 使用场合：当想访问互联网上的资源时，只能使用绝对路径

完整的绝对路径四个部分

一、协议名 http

二、域名（主机名，IP地址）www.baidu.com

三、跟相对路径

四、文件名

www.baidu.com/img/baidu_jgylogo3.gif

二、相对路径(重点)场合：使用本机文件时使用 从当前文件位置处开始查找资源文件所通过的路径

一、同目录，直接用

二、子目录，先进入 /

三、父目录，先返回 ../

三、跟相对路径 路径显示是以 /做为开始的。 /:表示是服务器的跟路径

二、图像

一、图像格式

wed中支持的图像格式

一、*.jpg

二、*.gif

三、*.png

二、图像的语法

标记:<img>

一、src:指定要显示图像 URL

二、width：图像的宽度

三、height：图像的高度

四、title：鼠标悬停时，要显示的文本

demo

<p>绝对路径</p>

<p>

<img src="http://www.baidu.com/img/day1/33.jpg">

</p>

<p>相对路径</p>

<p>

<img src="/img/33.jpg">

</p>

<p>跟相对路径</p>

<p>

<img src="/XUFEI/month1/day1/33.jpg"</

</p>

三、超连接

一、语法

标记：<a>内容</a>

属性：

一、href:要连接的HTML页面的URL

二、target：目标，指定新网页的打开方式

取值：

一、—blank：在新标签中打开网页

二、_self:在自身标签页中打开新网页

demo

<h3>一、哈哈哈哈哈哈哈</h3>

<a href="http://www.codeby.com">哈哈哈哈</a>

<h3>二、在新标签中打开</h3>

<a href="http://www.codeby.com" target="_blank"><img src="/XUFEI/month1/day1/33.jpg"></a>

二、连接的表现形式

一、点击操做时，完成资源下载的操做 连接的资源为zip/rar时则为下载操做<a href="day.rar">下载</a>