html——02（url、img、a、table、list）-蒲公英云

html——02（url、img、a、table、list）

1、URL
目录结构的表示方式
URL : Uniform Resource Locator , 统一资源定位器，俗称，路径
作用：用来标识网络中的资源位置
http://www.baidu.com
images/logo.gif
URL的三种形式:
1、绝对路径
2、相对路径
3、根相对路径

1）绝对路径
文件从最高级目录开始的完整的路径
绝对路径就是完整的URL
1、从本机目录结构查找，从盘符开始
D:\zhaoxu\HTML5Basic\Day02\images\logo.jpg
2、网络资源目录结构开始查找
协议、主机、目录路径、文件名称
http://www.baidu.com/images/logo.jpg
2）相对路径
相对于当前文件的位置，查找资源文件
1、同级目录(直接找)
直接输入资源文件名称即可
logo.png
2、子级目录(先进入)
先进入到指定文件夹，再查找资源文件
images/logo.png
3、父级目录(先返回)
先返回到指定的父级目录出，再查找指定资源文件
../ : 表示返回上一级
../../images/logo.png
3）根相对路径
file:///E:/zhaoxu/ …….. 本地访问

  http://www.baidu.com  
  http://localhost/ ...... 从服务器访问数据  
  根相对路径：  
  / 开始  
  /images/logo.png

2、图像
语法:
属性:
src : 图像的路径(绝对路径、相对路径、根相对路径)
width : 宽度
height: 高度
alt : 提示，
1、鼠标移入时显示的文本
2、图像不显示时，显示的文本
注意：通常情况下，不需要手动改变图像的宽和高
3、链接
能够完成简单的跳转动作
语法： ,anchor 缩写
属性：
href : 链接URL
target ：目标，指定打开新网页的方式
取值 _blank : 在新标签页中打开
_self : 在自身(当前)页面中打开(默认值)
name : 定义锚点名称
链接的表现形式:
1、页面间跳转
文本或图像
2、页面上的文档(资源)下载
文本或图像
资源路径：非html,htm,txt的资源
下载
3、返回页面顶部的空连接
返回顶部
跳转到本页(开发、测试阶段使用)
4、电子邮件链接
打开本机邮件客户端，向指定地址处发送email邮件
联系我们
5、链接到Javascript

锚点：在页面的任意位置处定义一个标识，随时随地的都可以跳转到这个标识上
什么时候使用:向快速的跳转到网页的某个位置处，可以选择使用锚点
锚点的使用方式：
1、定义锚点

2、链接到锚点
文本或图像

4、表格
1、什么是表格
有行有列，按照一定的格式(从左到右，从上到下)排列里面的内容
2、表格的作用
组织结构化的信息，按照一定的格式来进行数据显示
单元格?
3、创建表格
定义表格:

定义行: —> Table Row
创建列(单元格): —> Table Data
注意:原始的表格中，每行的列数全部都是统一的。
Question:创建一个表格，有3行2列

4、表格属性
table:
width : 宽度
height : 高度
align : 水平对齐方式（left,center,right）
border : 设置表格的变宽,以px(像素)为单位
cellpadding : 内边距,(单元格边框与内容之间的距离)
cellspacing : 外边距,(单元格与单元格之间的距离)
bgcolor : 表格背景颜色
tr :
align : 设置该行内容的水平对齐方式(left,center,right)
valign: 设置该行内容的垂直对齐方式(top,middle,bottom)
td :
align:
valign:
width:
height:
colspan : 单元格跨列(向右合并单元格)
rowspan : 单元格跨行(向下合并单元格)
5、表格标题
标题文本