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

我的总结:HTML语法精华!(原创)

2008-06-23 19:54 330 查看

*****************************HTML语法精华*****************************************

HTML是所有网页设计学习者所最先接触的,也是公认的最为简单和易上手的技术。下面我就以我的学习经验和感悟给大家总结了一些我认为重要的东西,以便大家更好的掌握,与运用。

------------------------->

强制断行标签<br/>

强制分段标签<p>

分隔线<hr>常用属性(color, width, size, noshade, align)

置中标签<center>

保存原始格式标签:<pre>文字内容<pre>

<pre>

文 字

 格 式

</pre>

字体标签:<h1>标题内容</h1>

标题的大小一共有六种,两个标签一组,也就是从<h1>到<h6>,<h1>最大,<h6>最小

设定字体大小标签:<font size=3>文字内容</font>

标题的大小一共有七种,也就是<font size=1>(最小)到<font size=7>(最大),另外,还有一种写法:<font size=+1>文字内容</font>,其意思就是说:比预设字大一级。当然也可以 font size=+2(比预设字大二级),或是 font size=-1(比预设字小一级),以一般而言,预设字体多为 3。

常用字型变化标签:

<sup>上标</sup>

<sub>下标</sub>

<blink>闪烁</blink>(ie没效果)

<em>强调</em>

<strong>加强</strong>

<address>所在地址</address>

特殊字元:

 代表一个不断行空白,其他的不常用。

设定文字内定值大小:<basefont size="1~7">

这个标签可以改变文字大小的内定值,直接加在<body>标签之后就行了。

影像标签:

<img src="图档" hspace="离左右物件的距离">

<img src="图档" vspace="离上下物件的距离">

背景标签:<body bgcolor="#ffffff" background="bg.jpg">

内文、链接文字颜色设定:<body text="#000000" link="#0000ff" vlink="#ff00ff" alink="#ff0000>

链接标签:<a href= “ ”>

网页内部的连结

<a name="here1">这里是你想连结的点</a>

设定连结:<a href="#here1">连结</a>

连结标签的参数

target=_blank:将连结的画面内容,开在新的浏览视窗中。

target=_parent:将连结的画面内容,当成文件的上一个画面。

target=_self:将连结的画面内容,显示在目前的视窗中。

target=_top:这个参数可以解决新连结的画面内容,被旧框窗包围的困扰,使用这参数,会将整个画面重新显示成连结的画面内容。

表格标签:

<TABLE BORDER=1>

<TR><TD></TD></TR>

</TABLE>

左右栏位合并:

<TABLE BORDER=1>

<TR><TD COLSPAN=3>1</TD></TR>

<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>

</TABLE>

上下栏位合并:

<TABLE BORDER=1>

<TR><TD ROWSPAN=2>1</TD><TD>2</TD><TD>3</TD></TR>

<TR><TD>5</TD><TD>6</TD></TR>

</TABLE>

表格背景、底色设定

<TABLE BORDER="1" BGCOLOR=#FFCC33>

<TR><TD>1</TD><TD>2</TD></TR>

<TR><TD>3</TD><TD>4</TD></TR>

</TABLE>

表格框线设定

<TABLE BORDER=5 BORDERCOLOR="#0080FF" BORDERCOLORLIGHT="#62B0FF" BORDERCOLORDARK="#004B97">

<TR><TD>1</TD></TR>

</TABLE>

表格栏距设定

<TABLE BORDER="1" CELLPADDING="10" CELLSPACING="5">

<TR><TD>1</TD><TD>2</TD></TR>

</TABLE>

序列标签

无序标签

(被广泛用于div+css层内文件的显示)

<UL TYPE="CIRCLE">

<LI></LI>

<LI></LI>

</UL>

有序标签

<OL TYPE="A">

<LI></LI>

<LI></LI>

</OL>

定义列表标签

(用法类似于<pre></pre>,比较常用)

<DL>

<DT>小标题</DT>

<DD>标题的内容说明</DD>

</DL>

添加音乐:<bgsound src="music.mid">

可是用NetScape看就没有声音了最好用embed标签 <embed src="music.mid">

Meta Tag 的简介:

<meta http-quive="content-type" content="text/html; charset=iso-8859-1">

说明网站的格式及编码方式,另外这个功能也可以拿来说明网站的名称。

<meta name="keyword" contents="关键字一, 关键字二, 关键字三, …..">

铲明整个网站的关键字,关键字间用逗点隔开,总长度最好不要超过1000个Character

<meta name="description" contents="整个网站的描述….">

铲明整个网站为何吸引人的地方,可用逗点隔开,总长度最好不要超过200个Character (约15个字),若文章真的太长,可以切割成两个部分,较不重要的部分置入下一个Description。

<meta name="robots" content=" ALL, NONE, INDEX, NOINDEX, FOLLOW, NOFOLLOW">

此功能是要给搜寻引擎使用的,是要用来告诉Spider哪些网页是要去撷取的或不用去撷取的,一般都设定成All(内定值)。

图层div(目前最重要也是最常用的标签,完全取代了table。div+CSS的应用完全取代了传统的网页制作模式)

图层是一个容器,在图层内可以放置各种类型的网页元素。如文本、图像、表格、甚至还可以放置图层(图层嵌套)。每个图层相当于一个独立的小屏幕。

图层是一个可以任意移动的容器,甚至允许图层之间重叠放置,这是它与框架的不同之处,这也是图层的最大优点。因为放置在图层上的元素,可以随图层被拖放到任意位置,为元素的定位和网页布局带来极大的方便,同时也为控制动态元素奠定了基础。

例如,利用下列代码创建一个宽100px、高100px的图层。

<div style="width: 100px; position: relative; height: 100px">我是层!</div>

表单form

目前的应用很多,主要是登录与注册的用户信息。

常用的有input--->type:text、password、submit.....

texterea/select---->option

框架frameset

NAME="1"

设定这个框架的名称,这样才能指定框架来作连结,所以一定要设定喔!当然名称随你高兴取名。

frameborder=0

设定框架的边框,其值只有 0 和 1 , 0 就是不要边框, 1 就是要显示边框。边框是无法调整粗细的。

scrolling="no"

设定是否要显示卷轴,YES是要显示卷轴,NO是无论如何都不要显示,AUTO是视情况显示。

noresize

设定不让使用者可以改变这个框框的大小,如果没有设定这个参数,使用者可以很容易的拉动框架,改变其大小。

marginhight=2

表示框架高度部份边缘所保留的空间。

发现很多人盗取我的劳动成果,真的太气人了!!!(特此声明)

施杨出品

!!! 拒绝转载!!!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: