html笔记

来源:互联网 发布:python gui wxpython 编辑:程序博客网 时间:2024/06/05 00:34

html中 超链接:

<a href="URL"></a>

其中URL是是同一资源的定位。

图片

<img src="图片的路径/图片也可以是一个url"width="宽度"height="高度" alt="这是一只狗"border="4px" bordercolor="blue"/>

这里的高度和宽度只需要指定一个,他会按照比例缩放,border是边框

表格布局

<table border="1" bordercolor="red" cellpadding="10" width="400px">        <tr>            <td align="center" colspan="3">菜谱</td>        </tr>        <tr>            <td align="center" colspan="3">菜谱</td>            <td align="center" colspan="3">菜谱</td>            <td align="center" colspan="3">菜谱</td>        </tr>        <tr>            <td align="center" colspan="3">菜谱</td>            <td align="center" colspan="3">菜谱</td>            <td align="center" colspan="3">菜谱</td>        </tr>    </table>

“cellpadding=”10””控制的是表格和文字之间的距离
图示:
这里写图片描述
这里写图片描述

Frameset框架集

text.html文件

<meta charset="utf-8"><frameset cols="50%,50%">    <frame name="frame1" src="b.html"></frame>    <frame name="frame2" src="c.html"></frame></frameset>

b.html文件

<meta charset="utf-8"><body bgcolor="green">    <a href="1.html" target="frame2">周杰伦</a><br/>    <a href="2.html" target="frame2">陈奕迅</a><br/>    <a href="3.html" target="frame2">刀郎</a><br/>    <a href="4.html" target="frame2">刘欢</a><br/></body>

c.html文件

<meta charset="utf-8"><body bgcolor="pink">    c.html</body>

1,2,3,4.html文件

<meta charset="utf-8"><body bgcolor="">周杰伦</body><meta charset="utf-8"><body bgcolor="blue">陈奕迅的歌</body><meta charset="utf-8"><body>刀郎的歌</body><meta charset="utf-8"><body>刘欢的歌</body>

最后的显示效果图:
这里写图片描述
这里写图片描述
这里写图片描述

原创粉丝点击