超链接

h1,h2,h3...

图片超链接

邮件超链接

图像热区超链接

图像热区超链接-自己作图

图像热区超链接-多热区

插入一个框架-frame（将一个html文件当做一个frame）

插入一个框架-frame（同样可以是一个网址）

插入一个框架-iframe（网址）

超链接


<html><head><title>超链接</title></head><body><p>点击<a href= "http://www.artech.cn/guest-book.html">链接01</a>链接到第1个网页。</p><p>点击<a href= "/02.html">链接02</a>链接到第2个网页。</p><p>点击<a href= "../sub/03.html">链接03</a>链接到第3个网页。</p></body>
</html>

h1,h2,h3...

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>Title</title></head><body><h1>Web</h1><h2>在这里向您推荐最好的Web设计图书</h2><h2>在这里向您推荐最好的Web设计图书</h2><p><a href="#first">第1本书</a> <a href="#second">第2本书</a> <a href="#third">第3本书</a></p><h3><a name="first"></a>精通CSS+DIV网页样式与布局</h3><p>本书系统地讲解了CSS层叠样式表的基础理论和实际运用技术</p><p>详细介绍</p><h3><a name="second"></a>CSS设计彻底研究</h3><p>本书是一本深入研究和揭示CSS设计技术的书籍。<br>详细介绍</p><h3><a name="third"></a>CSS设计禅意花园</h3><p>本书作者是世界著名的网站设计师<br>详细介绍</p><h4>技术趋势</h4><p>今年是社会化网络年。</p><p>RSS继续向主流应用渗透。</p><p>Web 2.0这个词被大众认为是一个市场营销的用语。</p><h4>关于本站</h4><p>本站作者是一名Web设计和开发的爱好者。</p></body>
</html>

图片超链接


<html><head><title>图片的超链接</title></head><body><a href=1.html><img src=cup.gif></a><br></body>
</html>

邮件超链接


<html><head><title>邮件的链接</title></head><body>联系我们：<a href="mailto:support@artech.cn">给我们发送邮件</a>。</body>
</html>

图像热区超链接


<html><head><title>图像热区</title></head><body><img src="stars.jpg" border="0" usemap="#Map">
<map name="Map"><area shape="poly" coords="26,130,62,113,144,119,161,203,69,228,31,221,14,202,8,155" href="http://baike.baidu.com/view/6023.htm">
</map>
</body>
</html>

图像热区超链接-自己作图


<html>
<head>
<title>图像热区</title>
</head>
<body>
<img src="hotmap.jpg" border="0" usemap="#Map">
<map name="Map"><area shape="rect" coords="16,37,127,105" href="01.htm"><area shape="circle" coords="204,69,41" href="02.htm"><area shape="poly" coords="284,15,344,4,386,59,330,111,268,56" href="03.htm">
</map>
</body>
</html>

图像热区超链接-多热区


<html>
<head>
<title>图像热区</title>
</head>
<body style="margin:0">
<img src="navi.jpg" width="400" height="200" border="0" usemap="#Map">
<map name="Map"><area shape="rect" coords="303,22,377,52" href="04-08-01.htm" target="main"><area shape="rect" coords="242,76,321,105" href="04-08-02.htm" target="main"><area shape="rect" coords="141,126,216,157" href="04-08-03.htm" target="main"><area shape="rect" coords="15,152,92,183" href="04-08-04.htm" target="main">
</map>
</body>
</html>

插入一个框架-frame（将一个html文件当做一个frame）

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><frameset rows="210,*" cols="*"><frame src="04-07.htm"><frame src="04-08-01.htm" name="main" >
</frameset>
<noframes></noframes></html>

插入一个框架-frame（同样可以是一个网址）


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><frameset rows="210,*" cols="*"><frame src="04-07.htm"><frame src="https://www.baidu.com/" name="main" >
</frameset>
<noframes></noframes></html>

插入一个框架-iframe（网址）

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><body>
<p>这是<strong>公司介绍</strong>页面 </p><iframe width=700 height=200 src=http://www.baidu.com > </iframe></body></html>

【HTML＋CSS网页设计与布局从入门到精通】第4章相关推荐

【HTML＋CSS网页设计与布局从入门到精通】第13章-块元素div和内联元素span格式布局
目录块元素背景,边框,颜色等布局块元素ID选择器另一个例子块元素中的图片盒子模型的演示块级元素中的文本格式块级元素div与内联元素span的对比两个行内元素的margin 两个块级元素 ...
【HTML＋CSS网页设计与布局从入门到精通】第10章-CSS
目录开始新增设置英文字母全部小写字号设置首字母"大"写-大一点显示上划线,下划线text-decoration:underline overline; 缩进text-i ...
【HTML＋CSS网页设计与布局从入门到精通】第9章-选择器
目录标记选择器+类别选择器并集选择器+集体声明后代(嵌套)选择器继承关系演示前沿Web开发教室继承关系演示-选择器1 继承关系演示-选择器2 还可以写成这样批量的整或者再或者 or 层 ...
【HTML＋CSS网页设计与布局从入门到精通】第15章-表格格式：边距/居中/边框/折叠
目录初始表格边距.居中.边框单元格边距cellspacing 边距折叠(两个叠加不会变粗)border-collapse:collapse; 单元格边距border-spacing 初始表格 & ...
【HTML＋CSS网页设计与布局从入门到精通】第14章-float/position/display属性
目录 float属性 float:left float:left-例2 float:left-例3 float:right; 对比father p{clear:right;} 例1 例2 .fathe ...
【HTML＋CSS网页设计与布局从入门到精通】第12章-CSS
目录开始背景+颜色将图片当做背景background-image:url(bg-h.gif); x方向(横向)重复显示图片: y方向(纵向) 不重复显示图片background-repeat:n ...
【HTML＋CSS网页设计与布局从入门到精通】第11章-CSS
目录图像class选择器设置图片每个边框的格式:颜色,线型另一个例子图文混排图片左对齐,居中,右对齐竖直对齐竖直对齐:具体数值-负数八大行星:图文混排图像class选择器 <h ...
【HTML＋CSS网页设计与布局从入门到精通】第8章-CSS
目录无格式图文并茂标题h1格式图片img格式正文p格式 body格式 ID选择器的优先级低于标记选择器无格式 <html> <head> <title> ...
【HTML＋CSS网页设计与布局从入门到精通】第7章-class、ID选择器，CSS格式
目录 class选择器 class选择器-例外 class选择器-同时使用两种class ID选择器不支持两种同时使用正文字体格式正文字体格式-另一种"宏"的使用方式使用CS ...

【HTML＋CSS网页设计与布局从入门到精通】第4章

超链接

h1,h2,h3...

图片超链接

邮件超链接

图像热区超链接

图像热区超链接-自己作图

图像热区超链接-多热区

插入一个框架-frame（将一个html文件当做一个frame）

插入一个框架-frame（同样可以是一个网址）

插入一个框架-iframe（网址）

【HTML＋CSS网页设计与布局从入门到精通】第4章相关推荐

最新文章

热门文章

【HTML＋CSS网页设计与布局 从入门到精通】第4章

超链接

h1,h2,h3...

图片超链接

邮件超链接

图像热区超链接

图像热区超链接-自己作图

图像热区超链接-多热区

插入一个框架-frame（将一个html文件当做一个frame）

插入一个框架-frame（同样可以是一个网址）

插入一个框架-iframe（网址）

【HTML＋CSS网页设计与布局 从入门到精通】第4章相关推荐

最新文章

热门文章

【HTML＋CSS网页设计与布局从入门到精通】第4章

【HTML＋CSS网页设计与布局从入门到精通】第4章相关推荐