超级链接

3.31 超级链接

课前作业小测

(1).Index文件的大小是(K)?

(2).CSS的注释格式为: /解释内容/

(3).空格的字符代码是 &nbsp

(4).htm和HTML没有区别

(5).html5文档的开始,定义的标签为:doctype 、DOCTYPE、docType

超级链接

1.空链接

<a href="#">空链接</a>

eg.

<head> <meta charset="utf-8" /> <title>山东商务职业学院</title> </head> <body> <h1><a:href="">山东商务职业学院</a></h1> </body> 超链接元素
##### 二、什么时候需要用到空链接?

作用:有链接的样子,无跳转行为。用来占位、做交互、演示、禁用。

###### 同一个页面将7种不同样式的超级链接预览效果

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			.one{
				background-color: #FF0000;                                              
			}
			.two{
				background-color: #FF7F00;
			}
			.three{
				background-color:#FFFF00;
			}
			.four{
				background-color:#00FF00;
			}
			.five{
				background-color:#00FFFF;
			}
			.six{
				background-color:#0000FF;
			}
			.seven{
				background-color:#8B00FF;
			}
		</style>
	</head>
	<body>
		<h1><a href=" " class="one">空链接</a ></h1>
		<h1><a href="#" class="two">内部链接</a ></h1>
		<h1><a href="#" class="three">外部链接</a ></h1>
		<h1><a href="#" class="four">锚记</a ></h1>
		<h1><a href="#" class="five">电子邮件</a ></h1>
		<h1><a href="#" class="six">点我下载</a ></h1>
		<h1><a href="#" class="seven">JS交互</a ></h1>
	</body>
</html>

<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			.one{
				background-color: #FF0000;                                              
			}
			.two{
				background-color: #FF7F00;
			}
			.three{
				background-color:#FFFF00;
			}
			.four{
				background-color:#00FF00;
			}
			.five{
				background-color:#00FFFF;
			}
			.six{
				background-color:#0000FF;
			}
			.seven{
				background-color:#8B00FF;
			}
		</style>
	</head>
posted @ 2026-04-06 21:08  安徒生的熊  阅读(7)  评论(0)    收藏  举报