html5中文学习网

您的位置: 首页 > 网页制作 > html教程 » 正文

html的基本使用包括链接、样式表、span和div等等_HTML/Xhtml_网页制作

[ ] 已经帮助:人解决问题
点评:html的基本使用包括链接、多视窗口FRAMES、样式表、span和div等等,在本文已给出详细的使用介绍,感兴趣的朋友可以参考下,希望对大家有所帮助
一、链接 kfNHTML5中文学习网 - HTML5先行者学习网
在HTML中超文本的链接非常重要,基本格式如下: kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
<A HREF="资源地址">链接文字</A> kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
1、本地链接 kfNHTML5中文学习网 - HTML5先行者学习网
①绝对路劲: kfNHTML5中文学习网 - HTML5先行者学习网
<A HREF="C:/images/article.jpg">绝对路劲链接到本地图片</A> kfNHTML5中文学习网 - HTML5先行者学习网
②相对路劲 kfNHTML5中文学习网 - HTML5先行者学习网
<A HREF ="article2.jpg"> 相对路劲链接到本地图片</A> kfNHTML5中文学习网 - HTML5先行者学习网
③链接到上一级目录 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
<A HREF="../test.htm">链接到上一级目录</A> kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
2、URL链接 kfNHTML5中文学习网 - HTML5先行者学习网
形式:协议名://主机.域名/路劲/文件名 kfNHTML5中文学习网 - HTML5先行者学习网
协议包括: kfNHTML5中文学习网 - HTML5先行者学习网
file 本地系统文件 kfNHTML5中文学习网 - HTML5先行者学习网
http WWW服务器 kfNHTML5中文学习网 - HTML5先行者学习网
ftp ftp服务器 kfNHTML5中文学习网 - HTML5先行者学习网
telnet 基于TELNET的协议 kfNHTML5中文学习网 - HTML5先行者学习网
mailto 电子邮件 kfNHTML5中文学习网 - HTML5先行者学习网
news Usenet新闻组 kfNHTML5中文学习网 - HTML5先行者学习网
gopher GOPHER服务器 kfNHTML5中文学习网 - HTML5先行者学习网
wais WAIS服务器 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
如:<A HREF="http://www.baidu.com"> 百度一下</A> kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
3、目录链接 kfNHTML5中文学习网 - HTML5先行者学习网
首先把某段落设置为链接位置,格式为: kfNHTML5中文学习网 - HTML5先行者学习网
<A NAME="链接位置名称"></A> kfNHTML5中文学习网 - HTML5先行者学习网
再调用此链接部分的文件,定义链接: kfNHTML5中文学习网 - HTML5先行者学习网
<A HREF="文件名#链接位置名称">链接文字</A> kfNHTML5中文学习网 - HTML5先行者学习网
当然如果在一个文件内跳转,文件名就可以省略不写。 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
二、多视窗口FRAMES kfNHTML5中文学习网 - HTML5先行者学习网
使用FRAMES结构设计的HTML文件,能够将整个窗口分成几个独立的小窗口,每个小窗口可分别载入不同的文件,并且可以相互沟通。 kfNHTML5中文学习网 - HTML5先行者学习网
1、基本结构: kfNHTML5中文学习网 - HTML5先行者学习网
<HTML> kfNHTML5中文学习网 - HTML5先行者学习网
<HEAD> kfNHTML5中文学习网 - HTML5先行者学习网
<TITLE></TITLE> kfNHTML5中文学习网 - HTML5先行者学习网
</HEAD> kfNHTML5中文学习网 - HTML5先行者学习网
<FRAMESET> kfNHTML5中文学习网 - HTML5先行者学习网
<FRAME SRC="url"> kfNHTML5中文学习网 - HTML5先行者学习网
<FRAME SRC="url"> kfNHTML5中文学习网 - HTML5先行者学习网
... kfNHTML5中文学习网 - HTML5先行者学习网
</FRAMESET> kfNHTML5中文学习网 - HTML5先行者学习网
</HTML> kfNHTML5中文学习网 - HTML5先行者学习网
2、各窗口的尺寸设置 kfNHTML5中文学习网 - HTML5先行者学习网
我们将窗口分割为几块,横向分用ROWS属性,纵向分用COLS属性,每一块的大小可以由这两个属性的值来实现。 kfNHTML5中文学习网 - HTML5先行者学习网
<frameset cols=#> kfNHTML5中文学习网 - HTML5先行者学习网
<frameset rows=#> kfNHTML5中文学习网 - HTML5先行者学习网
#的值为一对用引号括起来的字符串,字符串中的数字表示每个窗口所占的大小,中间用逗号隔开,其中的数字也可以用"*"来代替,表示由浏览器自动分配大小。如 kfNHTML5中文学习网 - HTML5先行者学习网
<frameset cols="100,200,300"> kfNHTML5中文学习网 - HTML5先行者学习网
<frameset rows="10%,20%,70%"> kfNHTML5中文学习网 - HTML5先行者学习网
<frameset cols="100,*,*"> 将100像素以外的窗口平均分配 kfNHTML5中文学习网 - HTML5先行者学习网
3、各窗口间的相互操作 kfNHTML5中文学习网 - HTML5先行者学习网
①frame的src属性 用来指定要链接的内容,name属性指定该窗口的名字,target属性用来指定所链接的文件出现在哪一窗口,其值可以是name定义的名称,也可以是下面四类值: kfNHTML5中文学习网 - HTML5先行者学习网
<a href=url target=_blank> 显示一个新窗口 kfNHTML5中文学习网 - HTML5先行者学习网
<a href=url target=_self> 显示在同一个窗口 kfNHTML5中文学习网 - HTML5先行者学习网
<a href=url target=_parent> 显示在Frameset的前一份文件的窗口 kfNHTML5中文学习网 - HTML5先行者学习网
<a href=url target=_top> 显示在整个浏览器窗口 kfNHTML5中文学习网 - HTML5先行者学习网
②frame的其他属性 kfNHTML5中文学习网 - HTML5先行者学习网
<frame frameborder=#> #=yes,no kfNHTML5中文学习网 - HTML5先行者学习网
frameborder指定各窗口边框的设置:yes表示有边框,no表示无边框 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
<frame marginwidth=# marginheight=#> kfNHTML5中文学习网 - HTML5先行者学习网
#的值为像素点,该属性用来设置窗口的上下左右边界宽度,如不设定,由浏览器自动决定。 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
<frame scrolling=#>#=yes,no,auto kfNHTML5中文学习网 - HTML5先行者学习网
滚动条设置,yes表示有,no表示没有,auto表示由浏览器自动设置,缺省值是auto。 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
<frame noresize="noresize"> kfNHTML5中文学习网 - HTML5先行者学习网
noresize 属性规定用户无法调整框架的大小。默认地,可以通过拖动框架之间的“墙壁”来改变框架的大小,该属性可以锁定框架的大小。 kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
三、样式表 kfNHTML5中文学习网 - HTML5先行者学习网
1.样式表最重要的作用是提供了一种能使所有web页面的样式保持一致的方法。 kfNHTML5中文学习网 - HTML5先行者学习网
样式表的三个层次按照从低层到高层的顺序依次是: kfNHTML5中文学习网 - HTML5先行者学习网
①.内置(inline)样式表:适用于单个元素的内容 kfNHTML5中文学习网 - HTML5先行者学习网
②.文档层(document level)样式表:适用于整个文档的主体 kfNHTML5中文学习网 - HTML5先行者学习网
③.外部(external)样式表:可以应用在多个文档的主体中 kfNHTML5中文学习网 - HTML5先行者学习网
在使用时,如果出现冲突,低层次的样式表具有使用上的优先权。 kfNHTML5中文学习网 - HTML5先行者学习网
2.使用CSS需要注意的问题: kfNHTML5中文学习网 - HTML5先行者学习网
①有些浏览器可能不支持某些属性值,这时浏览器要么忽略这些属性值要么用一个可选值代替。 kfNHTML5中文学习网 - HTML5先行者学习网
②内置样式只适应单个元素,其实违背了样式表的设计初衷,所以应该谨慎使用。 kfNHTML5中文学习网 - HTML5先行者学习网
③文档层样式说明出现在文档的头部分,适用于文档的整个主体。所以网站建设的整体风格能够保持一致就是这么实现的。 kfNHTML5中文学习网 - HTML5先行者学习网
④外部样式表不属于使用它的文档的一部分,外部样式表需要单独存储,并且使用它时都要进行说明。可以使用MIME类型text/css将外部样式表编写成一些文本文件,它们可以存储在因特网上的任何一台计算机中,浏览器获取外部样式表就如同获取文档一样。网页首部的<link>元素也可用于指定外部样式表,在<link>中,rel属性用于指定被链接的文档与包含改链接的文档之间的关系,而href属性用于指定样式表文档的URL地址。如 kfNHTML5中文学习网 - HTML5先行者学习网
<link rel=stylesheet type="text/css" href="themes/AutoTheme/style.css"></link> kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
四、span和div kfNHTML5中文学习网 - HTML5先行者学习网
<span> 的使用 kfNHTML5中文学习网 - HTML5先行者学习网
在有些情况下,要求某些特殊的字体属性只应用于整个段落的部分文本,比如把某个字或词组设置为不一样的字体或背景等等。这是就可以使用<span>元素,比如: kfNHTML5中文学习网 - HTML5先行者学习网
<p>我非常喜欢<span style="font-size:24pt;font-family:黑体;color:red">编程</span>,这是一件非常愉快的事。</p> kfNHTML5中文学习网 - HTML5先行者学习网
kfNHTML5中文学习网 - HTML5先行者学习网
<div>的使用 kfNHTML5中文学习网 - HTML5先行者学习网
在网页中,节是很常见的形式,每节由若干段落构成,若在设计中,希望不仅是对各个段落,而是可以对网页中的节进行样式设置。这时就可以使用<div>,它的主要用途是指定网页中某节或某区域的外观展示细节。
(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助