HTML 4 超链接&图片&表格

1 超链接

    网页和网站的区别:

    网页:由后缀名,html文件构成的

    网站:由若干个网页拼接在一起组成的

    超链接标签的使用(点击可以跳转到新的页面)

    标签名称: a

    默认样式

        – 超链接标签默认有下划线

        – 默认字体是有颜色的

        – 鼠标指针移上去的时候会变成手型(引导用户点击)

    属性

        – href 跳转地址路径

        在href中添加地址要加入http://(http协议)

        – title 提示文本 鼠标移入当前文本时候会出现一段提示

        – target 打开新窗口的方式

            – _self 默认值 打开窗口覆盖原窗口

            – _blank 打开一个新的窗口

        在head里加入<base target=”_blank”>,控制当前页面中所有a标签打开新窗口的方式是一个新的标签页。

2 图片

    标签名称: img

    属性

        – src 图片引入的路径

        – alt 表明当图片加载失败的时候 一段提示文本

        – title 提示文本

    了解的属性(html属性的单位是可以省略的-web中的单位是像素px)

        – width 宽度

        – height 高度

        – border 边框

    注:可下载一个image preview插件,以提示图片是否加载成功

3 路径的使用

        1.绝对路径(了解,不提议使用)

            – 含有盘符的

        2.相对路径

            – 同级找同级 目标文件的名称

            – 父级找子级 目标文件的文件夹名称/目标文件的名称

            – 子级找父级 ../目标文件名称

                – 命令 ../ 调出当前文件夹

        3.解释:

            – ./ 当前目录 同级找同级 是一样的

            – ../ 跳出当前文件夹

            – …/

4 div&span

    html+css div+css

    div:没有任何实际的含义 只是一个盒子 用来做网页布局

    span:没有任何实际的含义 只是一个盒子 用来包裹文本内容

5 作业-标签之间的嵌套关系

        标签之间的嵌套关系

        – 常见的嵌套关系 加粗和倾斜、ul>li>ol>li

        – p和h标签之间的嵌套

            – p和p标签 不可

            – h和h标签 不可

            – p和h标签 h1可以嵌套p

        – a>img

        – 总结: div(块级元素) 可以嵌套一切

表格

        表格的标签名称

            – table 表明表格

            – tr 表明表格中的行

            – td 表格表格中的列(行与列相交部分的单元格)

        表格的基本属性

            – 宽度width/高度height/边界border(表格边框的宽度)

            – bordercolor/bgcolor 边框的颜色/表格的背景颜色

            – cellspacing/cellpadding 单元格与单元格之间的间距/单元格与内容的距离

                – cell 细胞、单元格

                – space 空间

                – padding 内边距

            – 对齐方式

                – 水平方向 align:left right center

                – 垂直方向 valign:top bottom middle   

                – 给table加控制表格位置,给tr加控制一行元素的位置,给td加控制某一个元素的位置

                – 给table设置valign不会有变化

            – 难点:行列合并

                – 列合并 colspan

                – 行合并 rowspan

                – span作为属性出现的时候表明选中几个 行列合并的属性值要是一个数字 即格的数量

            – rules=”rows/cols/all/none/groups” 添加行列的分割线

                -rows只有行有分割线,cols只有列有分割线

                – groups 位于分组之间的分割线 ?

        表格中的高级属性及标签

            – 数据的行分组

                – tbody 默认会生成一次 包裹住表格中的所有内容 无数个

                – thead/tfoot 表格的头部和底部 成双成对 只有一个

            – 数据的列分组

                – 单标签 col

                – 双标签 colgroup

                – 属性:

                    – span 选择几个列

                    – width 控制这几个列的宽度

            – 表格的列标题

                – th 默认字体是加粗并且居中显示

            – 表格标题

                – caption

            – 字体颜色style=”color:palevioletred”

注:1.三行三列的表格简写:table>tr*3>td*3

3.合并单元格的时候注意竖着的即是列

aaaa

© 版权声明
THE END
如果内容对您有所帮助,就支持一下吧!
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容