您的位置:首页 > Web前端 > HTML

HTML自学基础

2016-05-30 00:00 579 查看
关于自学HTML中遇到的各类细节问题

1.<a>表示链接标签,类似的有<img src>.链接的地址在<base>中填写。<base href="http://......."/>

2.<base>标签只能在头部中定义,并且只能出现一个。

3.<link>只能在头部中定义,但是可以出现多次。其中的href属性来指向所连接文档的url。他的值可以使任何有效的文档的url。

4.向前链接和反转链接rel/rev,二者可以同时包含在一个link中,也可以同时创建多个link标签。

5.link标签与外部链接(与css文件链接)。用到的是link的type属性。

6.<p>p标签标示段落。<p class =添加css样式中函数

<link href="main.css" rel="stylesheet " type="text/css" /> css样式中:

.p1{
font-size:10px;

7.用<style>标签为文档创建内部样式表

<style>只能在头部中出现,但可以在头部中多次出现。是唯一为文档创建内部样式表。用到的属性type。用的语言即使css,相当于潜藏在html内部的css。

例如:



<title>
style标签设置文档的类型
</title>
<meta charset="utf-8" />
<style type="text/css">
.p1{font-size:10px;}
.p2{font-size:20px;}
.p3{font-size:30px;}
</style>
</head>
<body>
<p class="p1">我喜欢你</p>
<p class="p2">我喜欢你</p>
<p class="p3">我喜欢你</p>
</body>
</html>




运行结果:省略:

8.根据不同的媒体设备设置样式:如style 的media属性,指向不同的设备。



<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<style type="text/css">
@media print {
p{font-weight:bold;}
}
@media screen{
p{font-weight:lighter ;}
}
@media print,screen{
p{font-size:20px;}
}

</style>
</head>
<body>
<p>我喜欢你</p>
<p>我喜欢你</p>
<p>我喜欢你</p>
</body>
</html>




9.1<script>标签。为html添加脚本程序,脚本程序可以写在script内,也可以使用外部脚本文件。能使网页页面变得更加生动,并且能在客户端相应一定的事件,从而使页面具有良好的交互性。

script标签的type属性设置脚本语言的类型。通常有text/javascript和text/jsscript.通常使用前者。

例,当页面加载完成时弹出一个对话框。

<!DOCTYPE html>
<html>
<head>
<meta h
3ff8
ttp-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title> 设置脚本的类型 </title>
<script type="text/javascript" > window.onload = function () { alert("Hello World"); } </script>
<meta charset="utf-8" />
</head>
<body>
</body>
</html>


9.2外部脚本,通常Javascript与html分离,一般存放在.js的文件中。然后通过script的src属性引用该文件。

核心代码: <script type="text/javascript" src="mian.js">。

js文件中:

window.onload = function () {
alert("我喜欢你");
}

10<meta>标签,定义元数据,一把通过name或者http-equiv属性指定关键字。每一个关键字表示一个元数据段,通过content属性的设置该关键字对应的值来描述该元数据段。

meta不在页面中显示,但对网页的显示很重要。

meta标签定义的元数据,其中最重要的是:keywords和description。其中keywords描述文档的关键字,为搜索引擎提供线索,非常有用。description为搜索引擎提供一份关于文档的简单说明,非常有用。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: