建立和使用列表
列表简介
5.1 列表类型
插入定义列表<dl>
<dl>
<dt>游戏名称</dt>
<dd>星际争霸</dd>
<dd>红色警戒</dd>
<dt>部门名称</dt>
<dd>技术部</dd>
<dd>培训部</dd>
</dl>
插入无序列表<ul>
列表类型:无序列表
<ul>:符号标签(○●■)
type属性:disc ● ( 默认) circle ○ square ■
如果想做出效果更好的列表,如:黑色圆点用图片表示,就用到CSS。
<ul type="circle">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
插入有序列表<ol>
列表类型:有序列表
插入有序列表<ol>
插入有序列表<ol>——在<ol>中输入<type>属性
插入目录列表<dir>(过时)
插入菜单列表<menu>(过时)
嵌套有序与无序列表
5.2.2 嵌套有序与无序列表
小实例——列表在网页中的使用
超链接概述
链接在网页制作中是一个必不可少的部分,在浏览网页时,单击一张图片或者一段文字就可以弹出一个新的网页,这些功能都是通过超链接来实现的,在HTML文件中,超链接的建立是很简单的,但是掌握超链接的原理对网页的制作是至关重要的。在学习超链接之前,需要先了解一下“URL”,所谓URL(Uniform Resource Locator)指统一资源定位符,通常包括三个部分:协议代码、主机地址、具体的文件名。
超链接标签的使用
超链接标签
创建超链接的标签为<a>和</a>,使用格式如下: <a href=“资源地址” target=“是否在新窗口显示” title=“指向链接时显示的文字”> 链接名称 </a>
链接路径
绝对路径:包含了标识Internet上的文件所需要的所有信息,包括完整的协议名称、主机名称、文件夹名称和文件名称。格式为:
通信协议://服务器地址:端口号/文件位置…/文件名
http://ww.sina.com.cn/web/index.html
<a href=“htttp://221.192.237.88:82/main/user/”>Java精品课</a>
超链接标签的使用
链接路径
根路径:根路径文件夹地址的写法,首先以一个斜线开头,代表根目录,然后书写文件夹名,最后书写文件名。例如,/myweb/index.html
但多数情况下,不建议使用此中链接形式。
链接路径
相对路径:是以当前文件所在路径为起点,进行相对文件的查找。
链接到同一文档的某个部分2-1
锚记标签用于使用户“跳”到文档的某个部分
HTML 的 NAME 属性用于创建锚标记
为达到这种跳转效果,请在 HREF 参数中使用该标记
链接到同一文档的各个部分2-2
链接到其他文档的特定位置
电子邮件链接
用户可从网页发送电子邮件
发送E-mail:在html页面中,可以建立e-mail链接,当浏览者单击链接后,系统会启动默认的本地邮件服务系统发送邮件,格式为:
<a href=“mailto:e-mail地址?subject=邮件主题”> 描述文字
</a>
<a href=“mailto:[email protected]?subject=一个消息”>
联系我
</a>
LINK 颜色的设置
基本格式:<body link=”颜色” alink=”颜色” vlink=”颜色”>
link 超链接尚被选中的文字
alink 超链接点选但未被放开的颜色
vlink 超链接已被点选过的颜色
插入并格式化图像
图像标签
<img>标签:用于在网页中插入图像内容。
src属性:用于设置图像文件的相对或绝对URL地址。
HTML的图像文件类型有以下三种:
GIF:是图形和图片的最佳格式,适用于透明或动画图形。
JPG或JPEG:更适合存放照片
PNG:拥有许多JPEG与GIF的共同优点,所以最近越来越流行。
插入并格式化图像
图像文件名的路径分为绝对路径和相对路径两种:
绝对路径指的是将图像文件的全部路径都写出来,一般用于显示其他网站上的图像文件。
相对路径就是写出相对于当前html文件所在的目录,一般用于图像文件在本网站中的情况。例如,
src=“face1.jpg”
src=“images/face1.jpg”
src=“../face1.jpg”
src属性值以/开始,表示从根目录开始
注意:
通过设置width属性和height属性可以控制图像的显示宽度和高度,他们的长度单位可是百分比,也可是像素。
Width属性和height属性的设置只是改变了图像的显示尺寸,图像文件的实际大小不会因此而发生变化。如果width和height的设置值和图像实际尺寸不一致时,还会影响图像的显示效果。
因此,图像的大小应该在图像处理软件中进行调整。设置width和height的另一个好处是他们可以在图像被完全下载之前让浏览器知道该用多大的空间来显示图片,这样浏览器可以更快显示出美观的页面。
插入图像
插入图像
用图像作为超链接
格式:
<a href="URL"><img src="URL"></a>
注意点:边框的问题.
可通过border=“0”去掉边框
设置图像映射
图像地图:<map>
应用:当要在图像中选取某一部分作为连接的时候。如:中国地图每个省所对应的区域。
map标签要和img标签联合使用。