注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

我的绿色软件、网络笔记仓库

 
 
 

日志

 
 

HTML 语言常用标记 tag   

2009-12-14 18:36:17|  分类: CSS,HTML,代码 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

HTML( Hyper Text Mark-up Language ) 是在 SGML 定义下的一个描述性语言,或可说 HTML 是 SGML 的一个应用程式,HTML 不是程式语言,如 C++ 和 Java 之类,它只是标示语言。常用语网页设计的排版中。

1、标记名与小于号之间不能留有空白字符。标记字母大小写皆可。

2、双标记 : 起始标记和终结标记成对出现,把文字围住。 如 <B>Creation of Webpage</B> is my favourite.
空标记 : 起始标记单独出现, 如 <BR>

3、颜色表示可分两种: 以命名方式定义常用的颜色,如 RED。 以 RGB 值表示,如 #FF0000 表示 red。
对于三原色 HTML 分别给予两个十六进位去定义,也就是每个原色可有 256 种彩度,故此三原色可混合成一千六佰多万的颜色。如 :
白色的组成是 red=ff, green=ff, blue=ff, RGB 值即为 ffffff
红色的组成是 red=ff, green=00, blue=00, RGB 值即为 ff0000
绿色的组成是 red=00, green=ff, blue=00, RGB 值即为 00ff00
蓝色的组成是 red=00, green=00, blue=ff, RGB 值即为 0000ff
黑色的组成是 red=00, green=00, blue=00, RGB 值即为 000000 
(应用时常在每个 RGB 值之前加上符号 # 以示分别,但不加亦可)

NO 1、
<BODY text="#000000" link="#0000FF" alink="#FF0000" vlink="#0000FF" background="bg1.gif" bgcolor="#FFFFFF" leftmargin=2 topmargin=2 bgproperties="fixed">  :
alink: 刚按下时文字连结颜色
vlink:连结后的颜色
background: 墙纸
bgcolor: 背景色
bgproperties: 墙纸是否固定


NO 2、
<!--   -->:1、为文中不同部份加上说明,方便日后修改。 2、作版权声明

<hr align="left" width="20%" size="5" noshade color="red" id="hr" > :插入一条水平线
align : left, right, center, justify( 自动调整字间距来保证每行的左右对齐,但这个效果仅对于子母类型文字有效,用于中英文混排时常出错)
size: 线条厚度,以像素为默认
width: 有 % 表示选的是百分比,若为像素,则只写数值就可以了
noshade :设定线条为平面显示,默认没有,但若是有color选项,就没多大必要了
id: 是定义的水平线名
color: DW中的水平线属性里没有颜色一栏,所以只能在这里加上 color值

NO 3、
<pre>a b  c   d
e

 

f</pre>
<pre> :预设格式标记,可以令文件按照原始码的排列方式显示。这样就不用在dw的编辑区取敲多个<br>或<p>了,但这种效果在DW的

编辑区无法显示,在ie时能显示


NO 4、
If you want to know how to create you own homepage quickly, don't miss <NOBR>Chris's Creation of Webpage</NOBR> which will help you a lot.
<NOBR> :不折行标记。作用:令某些文字不因太长而绕行,一 显示于同一行或下一 行。它对住址、数学算式、一行数字、程式码等尤为有用。
比如此列,但你伸缩ie浏览器大小时,Chris's Creation of Webpage 始终在同一行中,若实在太小,则ie下方会出现滚动条

NO 5、
Please visit my other homepage which locate at ww.geocities.com/SiliconValley/<WBR>Sector/8234/index.html There are many softwares for download. I think you will really love that place.
<WBR>称为建议折行标记。作用:预设折行部位。
它没有侵犯到 <BR> 的责任,只是作建议而已,只是建议浏览器在这个标记处可以断行,至于换不换行还要根据整行文字长度而定。因此只要在连续的文字中间适当的插入若干<wbr>标记就能解决断行问题。

No 1、
<pre><em><strong>abc</strong></em></pre>
<pre><b><i>abc</i></b></pre>
<em> , <i> 都是 斜体; <b>, <strong> 都是 粗体, 至于二者的先后可以调换

No 2、
<pre><u>abc</u>        <strike>def</strike>  <big><big> ghi   <small>jkl  <sub>1   <sup>  2</pre>
在ie中显示为:

abc        def   ghi   jkl  1     2<u> 加底线( DW中不显示 )<STRIKE> 加上删除线的标记。 <BIG> 令字体加大。 <SMALL> 令字体变细。 <SUB> 为下标字, <SUP> 则为上标字。 No 3、
<h1>abc</h1>
<h6>abc</h6>
<h1> 到 <h6>标题标记,默认下由 <H1> 至 <H6> 变粗变大加宽的程度逐渐减小。每个标题标记所标示 的字句将独占一行且上下留一空白行。可以在style中自己定义每个h(n)的参数

 
No 4、
<font face="Arial" size="+2" color="#008000">Creation of Webpage</font>
size: 有1~7; +1~+7; -7~-1;
face: 设定文字的字形,Arial 是常用的一种,最好不要使用 Windows 内建字 形以外的字形


No 5、
<ul type="square" >
  <li type="circle">a</li>
  <li type="disc" >b</li>
  <li>c</li>
</ul>

<ol type="I" start="2"  >
  <li>a</li>
  <li>b</li>
  <li>c</li>
</ol>

<ol> ordered list; type 有 i, I, 1, a, A 五种,默认为1, start只能是正整数,默认为1;
<ul> unordered list; type 有 disc, square, circle 三种
<li> list item; type同上,因为<li> 和 <ul> type相同,所以二者连用时最好选一个


No 6、
<table width="400" border="1" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="myweb.gif" bgcolor="#0000FF" bordercolor="#FF00FF" bordercolorlight="#00FF00" bordercolordark="#00FFFF" cols="2">
<TABLE>是一个容器标记,其他表格标记只能在他的范围内才适用。<TR> row; <TD> column
border: 表格边框厚度,不同浏览器有不同的内定值,故最好指明。
cellspacing: 表格格线厚度,指整个表格的框架的厚度
cellpadding: 文字与格线的距离,指框内文字与框边的距离
valign: 表格内字画等的摆放位置(垂直),可选值为: top, middle, bottom
background: 表格纸,与 bgcolor同用时,bgcolor 被覆盖
bordercolor : 又可分为 bordercolorlight( “左+上” 边)和 bordercolordark
cols: 表格栏位数目,让浏览器在下载表格时先画出整个表格
(<TR>, <TD> 参数设置与<Table>类似)


No 7、
<form action="
http://your.isp.com/cgi-local/example.cgi" method="POST">
<from> 为容器标记,<input type="text" > 等都是在这里面的。
action="
http://your.isp.com/cgi-local/example.cgi"
表单通常是与 CGI 配合使用的,参数 action 便是用以指明该 CGI的位置,这样此表单所填的资料才能正确传给 CGI 作处理。若没有 CGI 以进行测试,可设定此参数为 ACTION="
mailto:your@email.com" 那样该表单所填的资料将会寄至 此电邮地址。
method: 传送资料给 CGI 的的方式,可选值为 POST, GET。你只需记住POST容许传送大量资料,但 GET则只接受低于 1K 的资 料,所以申请表单用的是POST 而搜找器用的是 GET。

No 8、
<input name="Your_Name" type="text" size="2" maxlength="100" value="abc" align="middle" />
name: 方便 CGI 辨认由表单传来的资料
text: 单行文字盒,上限为 255 字
size: 此一单行文字盒显示的长度
maxlength: 在输入电话时可设为8,年龄时可设为2


No 9、
<input name="Gender" type="radio" value="Male" checked /> Male
<input name="Gender" type="radio" value="Famale" checked /> Famale
radio: 单选按钮;
checked: 默认已选
另外两个t ype 类型: checkbox: 多选按钮;    password: 输入值显示位*,即密码输入框


No 10、
<input type="reset" name="Reset" value="确定" />
<input type="submit" name="Submit" value="取消" />
type: 只有 submit;
name: Submit 的功能随 name 的不同而不同,须和 CGI 配合。若你只需要普通的传送 键,则是其内定,不必用此参数。
value: 这个值不是输给 CGI 的,而是显示在按键上,可以不用,传送键的内定值为 Submit Query,清除键的内定值为 Reset。

No 11、
<input type="image" name="Submit" src="../images/0001.gif" align="absbottom" />
image: 这通常用以取代 Submit 及 Reset 两个按键,因为由DW产生的按键并不漂亮,这 Image 参数便容许你采用自已制造的按键。
align: 有 absmiddle, absbottom, baseline, left, right, middle, top, bottom, top, texttop


No 12、
<form action="
http://your.isp.com/cgi-local/example.cgi" method="POST" enctype="multipart/form-data">
<input type="File" name="upload" size="30" maxlength="100" accept="text/html">
</form>
accept: 所接受的文件类别,有二十六种选择,可不设定。
用以上传文件,点击Browse 可在本地浏览

No 13、
<input type="Hidden" name="ID" value="6618">
hidden: 输入方式为隐藏或内定。它不会显示任何输入介面,而是一个内定值随表单一起 传给 CGI,如由 CGI 产生的会员号码,或传入可更改的参数以调整 CGI 而避免 修改 CGI 程式码。
name:这文件传输的名称,用以识别之用。
value: 内定值,如此例会以如 ID=6618 形式传给 CGI。

No 14、
<input type="Button" value="回前一页" onclick="history.go( -1 );return true;">
button:输入方式为一般按键。常配合 Java Script 作为其启动按键。
name: 文件传输的名称,用处不大
value: 按键显示名称

No 15、
<select name="where" size="5"  multiple>
<option value="hk">Hong Kong</option>
<option value="tw" selected>Taiwan</option>
<option value="cn">China</option>
<option value="us">United States</option>
<option value="ca">Canada</option>
</select>
select: 是卷动选单标记,每一选项皆由 <OPTION> 所标示
name: 卷动选单名称,作识别之用,将会传及 CGI
size: 这卷动选单的列数,即其高度,若使用此参数则不会有 Pop Up 效 果。
multiple: 有多选功能


No 16、
<textarea name="comments" cols="40" rows="4" wrap="VIRTUAL">
这是预设的字句,通常留空的,随你喜欢。
</textarea>
textarea:  在DreamWeaver中,选择TextField后,选multiple,就可以产生此文字区块(TextArea)
wrap: 设定其折行属性,可选值为:default, off, physical, virtual。physical 会强迫刘览器在送资料到 CGI
时必须将实际文字中的换行一 并

送出,设为 virtual 时则送出连续成串的字(除非使用者按了键盘的 RETURN / ENTER)。
下面是 DreamWeaver 8 Help 中对 wrap 的解释:

Wrap (available when the Multiline option is selected) specifies how the user’s input will be displayed when the user enters more information than can be displayed within the defined text area. The wrap options are as follows:
Selecting Off or Default prevents text from wrapping to the next line. When the user’s input exceeds the right boundary of the text area, text will scroll toward the left. Users must press Return to move the insertion point to the next line in the text area.
Selecting Virtual sets word wrap in the text area. When the user’s input exceeds the right boundary of the text area, text wraps to the next line. When data is submitted for processing, word wrap isn’t applied to the data. It is submitted as one string of data.
Selecting Physical sets word wrap in the text area, as well as to the data when it is submitted for processing.

 {转自网络。}
  评论这张
 
阅读(145)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017