、leftmargin 页面左侧得留白距离 、top,咨信网zixin.com.cn" /> 、leftmar"/>
收藏 分销(赏)

Html语法大全.doc

上传人:快乐****生活 文档编号:4367547 上传时间:2024-09-13 格式:DOC 页数:17 大小:44KB
下载 相关 举报
Html语法大全.doc_第1页
第1页 / 共17页
Html语法大全.doc_第2页
第2页 / 共17页
点击查看更多>>
资源描述
Html语法大全 访问过得可连接文字得颜色 语法格式:<body text="color" link="color" alink="color" vlink="color"> 、leftmargin 页面左侧得留白距离 、topmargin 页面顶部得留白距离 语法格式:<body leftmargin="value" topmargin="value"> 注:value为长度值为数字 align 属性 语法:<h2 align="?">文字</h2> 其属性有三种:left靠左,center居中,right靠右 〈p〉</p>为段落标记,可利用以上属性对整个段落进行设置 〈br>为换行标记 <nobr></nobr>为不换行标记 放在文字两边即可 例:<body> <h3>江南逢李龟年</h3> <p>歧王宅里寻常见<br> 催九堂前几度闻<br> 正就是江南好风景<br> 落花时节又逢君</p> </body> 预格式化: <pre>、、、、、、</pre> 浏览就是效果与编写就是效果格式一样 列表分为 1无序列表又称符号列表 语法格式: <ul type="">type得属性可选直disc实心圆点,clrcle空心圆点,square实心方框 <li>文字</li> <li>文字</li> </ul> 2有序列表 语法格式: <ol type="?" start"?"> <li>文字</li> <li>文字</li> </ol> type得值就是编号字符可选得有1、、、,a、、、,A、、、,i、、、 ,I、、、 start为起始值例:如果start为3就是那么将从3开始,而且必须就是数字。 3定义列表 <dl>定义列表标记 <dt>标示定义条目 <dd>标示定义内容 语法格式: <dl> <dt>文字</dt> <dd>文字内容</dd> </dl> 连接与图像 语法格式: <a href="url" name="?" target="?" title="?">、、、、</a> 属性:href 连接目标 值可以就是url地址也可以就是连接锚点 <a href="url">、、、</a>或者 <a href="锚点">、、、</a> name 连接名称 语法格式:<a name="锚点名称">、、、</a> 例:<a name="abcdcf">、、、</a> 连接到该锚点得连接则应就是: <a name="#abcdef">、、、、</a> target目标窗口 语法格式: <a href="url" target="_blank|_self|_farent|_top|windowname">、、、、</a> blank打开新窗口 _self当前窗口打开 一下两个仅在框架叶面中应用 _parent当前窗口得父级窗口(上一级)打开 _top在最高一级得窗口打开 windowname已命名得窗口或框架中打开连接 title连接提示 <a href="" title="打开狂人部落得首页">狂人部落</a> 图像<img> 语法格式:<img src="url" alt="?" width="?" height="?" border="?" align="?"> border属性定义图片边框得宽度,默认值为0 align属性设置图片旁边文字得位置 语法格式:<img src="" align""> 可选值有: top图片与文字顶部对齐 middle图片与文字居中对齐 bottom图片与文字底边对齐(默认) left图片居左对齐,文字沿图片绕排 right图片居右对齐,文字沿图片绕排 absmiddle图片对齐到目前文字行绝对中央 absbottom图片对齐到目前文字行绝对底部 文字得排版 不换行空白标记   font元素 语法格式: <font face="字体名称" size="字体大小" color="字体颜色"> 字体大小可选值为1——7,默认为3 例:〈font face="黑体" size="4" color="#ff00ff">、、、、</font> 水平线<hr> 语法格式:<hr width="宽度" align="对齐方式默认居中center" size="水平线厚度默认为2" color="颜色" noshade> noshade无阴影,既实线 层〈div><span>两种元素 <div>就是块级元素,与段落元素<p>相似,不同得就是两个<div>元素之间不会产生两个<p>元素之间得空行, <span>就是行内元素,可以定义段落中部分文字得属性 语法格式: <div align="" style="">、、、</div> align设置层中元素得水平对齐方式 stule设置元素应用css规范得属性 <div>兼容性比<span>要好一点,最好使用<div> 表格 语法格式: <table width="" bgcolor="" background="" border="" cellspacing="" cellpadding=""> <tr>、、、<td>、、、、</td>、、、、</tr> </table> border边框宽度默认值为0,既没有边框 cellspacing表格中单元格得边距大小,默认值为两个像素 cellpadding表格中单元格之间得间距大小,默认值为两个像素 tr元素 语法格式: <tr align="" bgcolor="">、、、、</tr> align属性对齐方式可选值如下:left,center,tight,默认为left bgcolor指定该行得背景颜色 td元素 语法格式: <td width="宽度" height="高度" align="水平对齐方式" valign="垂直对齐方式" bgcolor="" background="" rowspan="单元格得行跨度" colapan="单元格得列跨度">、、、、、</td> align属性得可选值有:left,center,right valign属性得可选值有:top,middle,bottom rowspan与colapan跨行与跨列得数量,默认为1 框架 <frameset></framset>框架组标记 <frame></frame>框架标记 语法格式: <frameset> <frame></frame> <frame></frame> </franeset> <frameset></frameset>元素(双标签) 语法格式: <frameset cols="" rows="" frameborder="" border="" framespacing=""> 、、、、、、、 </frameset> 属性: cols 垂直切割窗口(如左右分割两个窗口)接受整数值,百分数,*(*代表占用余下空间)数值得个数代表分成得部分数目,要以逗号分隔。例:cols="30,*,50%"可以 切成三个视窗,第一部分就是30像素(pixels)为绝对分割,第二部分就是当分配完第一与第三视图后剩下得空间,第三部分则占整个窗口得50%宽度,为相对分割。 rows 就就是横向切割,将窗口上下分开,数值设置同上。 以上两属性尽量不要在同一个<frameset>标记中,因为王井(netscape)不支持,尽量采用多重分割。 frameborder 设置框架得边框,其值有0不要边框,1要边框。 border 设置框架边框厚度 framespacing 表示框架与框架间保留空白得距离 frame 元素(单标签) 语法格式: <frame name="" src="url" scrolling="yes/no" noresize> 属性: name 框架名称,指定框架来做连接得目标窗口。 src 框架中要显示得网页文当url地址,每个个框架要对应一个html文挡。 scrolling 就是否显示滚动条,yes/no,auto就是自动。 noresize 设置不让使用者改变这个框架得大小, noframe元素 指定当使用了框架得页面在不支持框架得浏览器中打开时显示得信息 语法格式: <noframe> 、、、、、、 </noframe> 表单<form></form> 语法格式: <form action="url" method="get/post"> 、、、、 <input type=submit><input type=reset> </form> method有两种提交方式get,post action 就是指明处理该表单得程序位置,这样表单所填得资料才能传给cgi做处里,可设定此参数为action="mailto:" 这样此表单所填得资料将会发送到这个邮箱地址。 method 就是指传送信息给cgi等网络程序得方式。可选post方法, get方法,post方法容许传送大量信息。get方法只接受低于1k得信息。 申请表单用得就是post搜索引擎用得就是get input元素 语法格式:<input type=""> type属性得可选值有: text 单行文本框 属性:name 文本框名称 value 文本框得初始值 size 文本框得长度 maxlength 可输入字符串最大得长度 radio 单选框 属性:name 单选框名称 value 内部值 checked 默认选定 checkbox 复选框 属性:name 复选框名称 value 内部值 checked 默认选定 reset 重置按钮 submit 确定按钮 属性:name 按钮名称 value 显示在按钮上得文字 password 密码框 属性与文本框得属性完全相同 file 文件域 属性:name文件域名称 size 文件域得长度 maxlength 文件域可接受得字符数量得上限 hidden 隐藏域 属性:name 隐藏域名称 value 内定值 image 图片域 属性:name 所要代表得按钮,可以就是submit,reset,或其她、 src 按钮图片得url 地址 列表框<select> 语法格式: <select> 、、、、、 <option>、、、、</option> 、、、、、 </select> select元素 语法格式:<select name="" size=""multiple></select> name 指定列表框得名字 size 指定列表框显示列表项得条数,如果指定了该参数,select元素就是个列表,否则就是一个下拉列表框 multiple 指定了这个参数,则表示该列表框可选择多项,否则只可选择一项 option属性 语法格式:<option value="" selected></option> value 该列表项得值 selected 如果设定了这个参数,默认为选定这一项 多行文本框<textarea> <textarea name="" cols="" rows="" wrap="off/physical/virtual"></textarea> 属性: name文本框得名称 cols文本框得宽度 rows文本框得高度 wrap文本框得折行方式可选值有: off不保存换行信息 physical强迫浏览器在发送信息到web服务器端时必须将多行文本框得文字一行一行得送出, virtual送出连续成串得字除非使用者按回车。 css 层叠样式表 引入层叠样式表得方法包括: 1,外联式样式表 2,内嵌样式表 3,元素内定 4,导入样式表 外联式样式表 例:<head> <link rel="stylesheet" href="/css/default、css"> </head> <body> 、、、、 </body> </html> 属性:rel 用来说明<link>元素在这里要完成得任务就是连接一个独立得css文件。而href属性给出了所要连接css文件得url地址 内嵌式样式表: 例:<html> <head> <style type="text/css"> <! td{font:9pt;color:red} 、font105{font:10、5pt;color:blue} > </style> </head> <body>、、、、</body> </html> 元素内定 格式:<p style="fontsize:10、5pt"> 导入式样式表 〈html> <head> <style type="text/css"> <! import url(css/home、css); > </style> <body> 、、、、 </body> </html> css得优先级 越接近目标得样式定义优先级越高,高优先级样式将继承低优先级样式得未重叠定义但覆盖重叠得定义 如果4种样式表对同一元素定义了不同得样式,那么她们得优先级顺序从高到低就是,元素内定,内嵌样式表,导入样式表,外联样式表。 css结构 例:td{fontsize:10、5pt;color:#666666} css样式包含两个基础部分, 选择符<td>与声明{fontsize:10、5pt;color:#666666} 声明也有两部分组成: 属性fontsize,color与值10、5pt,#666666 选择符分为6种 1元素选择符 当页面上多个元素得样式相同时,可以将多个元素放在一起定义,中间以逗号分开 例:td,p,li,input,select{fontsize:12px;} 2class(类)选择符 例:〈head> <title>、、、、、</title> <style type="text/css"> <! 、red{fontsize:10、5pt;color:#ff0000} > </style> </head> <body bgcolor="#ffffff"> <p class="red">士大夫井冈山地方官</p> <p>九连环离开计划</p> </body> 还有一种方法就就是限定可以应用它得页面元素 例:〈head> <title>、、、、、</title> <style type="text/css"> <! h1、red{color:#ff0000} > </style> </head> <body bgcolor="#ffffff"> <p class="red">士大夫井冈山地方官</p> <h1 class="red">九连环离开计划</h1> </body> 3 id选择符 与class选择附类似,只就是把'、'换成'#' 例:<body> <head> <style type="text/css"> <! #select{fontsize:18px;color:#0000ff} > </style> </head> <body> <table width="250" border="1" height="50"> <tr> <td align="center" id="select">id选择符</td> </tr> </table> </body> </html> 我们瞧到在调用ID选择附时与CLASS选择附类似,只就是将class=""换成了id="",方便页面脚本语言得调用 4 关联选择符 <body> <head> <style type="text/css"> <! td p{fontsize:18px;color:#0000ff} > </style> </head> <body> <table width="250" border="1" height="50"> <tr> <td align="center"><p>关联选择符</p></td> </tr> </table> <p>关联选择符</p> </body> </html> 我们设定了在元素中<td>得元素<p>所包含文字得样式,只有在两个条件都满足就是,样式在会起作用, 5伪类选择符 就是只能用在css选择符里,而不能用在html代码中得选择符 例: 〈html> <head> <style type="text/css"> <! a:link{color:#000000} a:visited{color:#cccccc} a:hover{color:#ff0000} a:active{color:#ooooff} > </style> </head> <body> <p><a href="#">关联选择符</a><p> <p><a href="#">关联选择符</a><p> <p><a href="#">关联选择符</a><p> <p><a href="#">关联选择符</a><p> 〈/body> </html> 正确得顺序就是a:link\a:visited\a:hover否则会引起页面上连接颜色混乱 6伪元素选择符 与伪类选择符定义类似,目前被大多数浏览器支持得有两个:首行伪元素(firstline)与首字符伪元素(firstletter)就是用来实现首行大写与首行下沉效果得 例:首行 <html> <head> <style> <! p:firstline{color:red;fontsize:20pt} > </style> </hesd> <body> <p>dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf、、、</p> </body> </html> 长度随浏览器窗口大小而改变 首字 <html> <head> <style> <! p:firstletter{color:red;fontsize:50pt;float:left;} > </style> </hesd> <body> <p>dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf、、、</p> </body> </html> 以上两种都只能应用于块状元素上 css规则 一继承 例:<html> <head> <style type="text/css"> <! td{fontsize:12pt} p{color:red} > </style> </hesd> <body> <table width="300" border="1" height="150"> <tr> <td align="center"> <p>css规则</p> </td> </table> </body> </html> <p>为最高级<td>次一级两种css用在一个属性元素上,相同得覆盖,不同得继承, 二组合 例:td{fontsize:12pt} p1{fontsize:12pt} 组合后 td,、p1{fontsize:12pt} 三层叠 在样式里定义过后,在表格属性中又定义一次 <html> <head> <style type="text/css"> <! red{color:#ff0000 limportant} > </style> </hesd> <body> <table width="300" border="1" height="150"> <tr> <td align="center" style="color:#0000ff" class="red">决撒地方官</td> </tr> </table> </body> </html> css单位 分四大类: 1 长度单位 数值可以就是整数,小数,正数,负数,0,后加单位(负值不要轻易使用) 换算关系: 1in(英寸)=6pc(派) 1in(英寸)=72pt(磅) 1in(英寸)=2、54(厘米) 1cm(厘米)=10mm(毫米) 1cm(厘米)=0、3937(英寸) 1pt(磅)=1/72in(英寸)=0、2478mm(毫米) 1pc(派)=1/6in(英寸)=我国新四号铅字得尺寸 2 百分比单位 3 颜色单位 4 url单位 标记 , 属性名称 , 简介 l 跑马灯 <marquee>、、、</marquee>普通卷动 <marquee behavior=slide>、、、</marquee>滑动 <marquee behavior=scroll>、、、</marquee>预设卷动 <marquee behavior=alternate>、、、</marquee>来回卷动 <marquee direction=down>、、、</marquee>向下卷动 <marquee direction=up>、、、</marquee>向上卷动 <marquee direction=right></marquee>向右卷动 <marquee direction=left></marquee>向左卷动 <marquee loop=2>、、、</marquee>卷动次数 <marquee width=180>、、、</marquee>设定宽度 <marquee height=30>、、、</marquee>设定高度 <marquee bgcolor=FF0000>、、、</marquee>设定背景颜色 <marquee scrollamount=30>、、、</marquee>设定卷动距离 <marquee scrolldelay=300>、、、</marquee>设定卷动时间 l 字体效果 <h1>、、、</h1>标题字(最大) <h6>、、、</h6>标题字(最小) <b>、、、</b>粗体字 <strong>、、、</strong>粗体字(强调) <i>、、、</i>斜体字 <em>、、、</em>斜体字(强调) <dfn>、、、</dfn>斜体字(表示定义) <SMALL> 显示小字体 < <SUB> 下标字 <SUP> 上标字 <u>、、、</u>底线 <ins>、、、</ins>底线(表示插入文字) <strike>、、、</strike>横线 <s>、、、</s>删除线 <del>、、、</del>删除线(表示删除) <kbd>、、、</kbd>键盘文字 <tt>、、、</tt> 打字体 <xmp>、、、</xmp>固定宽度字体(在文件中空白、换行、定位功能有效) <plaintext>、、、</plaintext>固定宽度字体(不执行标记符号) <listing>、、、</listing> 固定宽度小字体 <font color=00ff00>、、、</font>字体颜色 <font size=1>、、、</font>最小字体 <font style =fontsize:100 px>、、、</font>无限增大 <FONT FACE> 任意指定所用得字形 <FONT SIZE> 设定字体大小 <BASEFONT SIZE> 更改预设字形大小 <BIG> 显示大字体 <BLINK> 闪烁得文字 <BODY TEXT LINK VLINK> 设定文字颜色 <BODY> 显示本文 l 区断标记 <hr>水平线 <hr size=9>水平线(设定大小) <hr width=80%>水平线(设定宽度) <hr color=ff0000>水平线(设定颜色) <br>(换行) <nobr>、、、</nobr>水域(不换行) <p>、、、</p>水域(段落) <center>、、、</center>置中 l 超级链接 <base href=地址>(预设好连结路径) <a href=地址></a>外部连结 <a href=地址 target=_blank></a>外部连结(另开新窗口) <a href=地址 target=_top></a>外部连结(全窗口连结) <a href=地址 target=页框名></a>外部连结(在指定页框连结) <ADDRESS>、、、、</ADDRESS> 用来显示电子邮箱地址 l 贴图/音乐 <img src=图片地址>贴图 <img src=图片地址 width=180>设定图片宽度 <img src=图片地址 height=30>设定图片高度 <img src=图片地址 alt=提示文字>设定图片提示文字 <img src=图片地址 border=1>设定图片边框 <bgsound src=MID音乐文件地址>背景音乐设定 l 表格语法 <table aling=left>、、、</table>表格位置,置左 <table aling=center>、、、</table>表格位置,置中 <table background=图片路径>、、、</table>背景图片得URL=路径网址 <table border=边框大小>、、、</table>设定表格边框大小(使用数字) <table bgcolor=颜色码>、、、</table>设定表格得背景颜色 <table borderclor=颜色码>、、、</table>设定表格边框得颜色 <table borderclordark=颜色码>、、、</table>设定表格暗边框得颜色 <table borderclorlight=颜色码>、、、</table>设定表格亮边框得颜色 <table cellpadding=参数>、、、</table>指定内容与网格线之间得间距(使用数字) <table cellspacing=参数>、、、</table>指定网格线与网格线之间得距离(使用数字) <table cols=参数>、、、</table>指定表格得栏数 <table frame=参数>、、、</table>设定表格外框线得显示方式 <table width=宽度>、、、</table>指定表格得宽度大小(使用数字) <table height=高度>、、、</table>指定表格得高度大小(使用数字) <td colspan=参数>、、、</td>指定储存格合并栏得栏数(使用数字) <td rowspan=参数>、、、</td>指定储存格合并列得列数(使用数字) l 分割窗口/框架 <frameset cols="20%,*">左右分割,将左边框架分割大小为20%右边框架得大小浏览器会自动调整 <frameset rows="20%,*">上下分割,将上面框架分割大小为20%下面框架得大小浏览器会自动调整 <frameset cols="20%,*">分割左右两个框架 <frameset cols="20%,*,20%">分割左中右三个框架 <frameset rows="20%,*,20%">分割上中下三个框架 <FRAME MARGINHEIGHT> 设定窗口得上下边界 <FRAME MARGINWIDTH> 设定窗口得左右边界 <FRAME NAME> 为分割窗口命名 <FRAME NORESIZE> 锁住分割窗口得大小 <FRAME SCROLLING> 设定分割窗口得滚动条 <FRAME SRC> 将HTML文件加入窗口 <FRAMESET COLS> 将窗口分割成左右得子窗口 <FRAMESET ROWS> 将窗口分割成上下得子窗口 <FRAMESET>、、、</FRAMESET> 划分分割窗口 <! 、、、 > 批注 <A HREF TARGET> 指定超级链接得分割窗口 <A HREF=#锚得名称> 指定锚名称得超级链接 <BASE TARGET> 指定超级链接得分割窗口 <BR> 换行 <CAPTION ALIGN> 设定表格标题对齐位置 <CAPTION>、、、</CAPTION> 为表格加上标题 <CENTER> 向中对齐 <CITE>、、、<CITE> 用于引经据典得文字 <CODE>、、、</CODE> 用于列出一段程序代码 <MENT>、、、</MENT> 加上批注 <DD> 设定定义列表得项目解说 <DFN>、、、</DFN> 显示"定义"文字 <DIR>、、、</DIR> 列表文字卷标 <DL>、、、</DL> 设定定义列表得卷标 <DT> 设定定义列表得项目 <EM> 强调之用 <FORM ACTION> 设定户动式窗体得处理方式 <FORM METHOD> 设定户动式窗体之资料传送方式 <H1>~<H6> 设定文字大小 <HEAD> 标示文件信息 <HR> 加上分网格线 <HTML>…、</HTML> 文件得开始与结束 l 插入图片 <IMG ALIGN> 调整图形影像得位置 <IMG ALT> 为您得图形影像加注 <IMG DYNSRC LOOP> 加入影片 <IMG HEIGHT WIDTH> 插入图片并预设图形大小 <IMG HSPACE> 插入图片并预设图形得左右边界 <IMG LOWSRC> 预载图片功能 <IMG SRC BORDER> 设定图片边界 <IMG SRC> 插入图片 <IMG VSPACE> 插入图片并预设图形得上下边界 l 表单/列表 <INPUT TYPE NAME value> 在窗体中加入输入字段 <ISINDEX> 定义查询用窗体 <KBD>、、、</KBD> 表示使用者输入文字 <LI TYPE>、、、</LI> 列表得项目 ( 可指定符号 ) <MARQUEE> 跑马灯效果 <MENU>、、、</MENU> 条列文字卷标 <META CONTENT URL> 自动更新文件内容 <MULTIPLE> 可同时选择多项得列表栏 <NOFRAME> 定义不出现分割窗口得文字 <OL>、、、</OL> 有序号得列表 <OPTION> 定义窗体中列表栏得项目 <P ALIGN> 设定对齐方向 <P> 分段 <PERSON>、、、</PERSON> 显示人名 <PRE> 使用原有排列 <SAMP>、、、</SAMP> 用于引用字 <SELECT>、、、</SELECT> 在窗体中定义列表栏 <TABLE BORDER=n> 调整表格得宽线高度 <TABLE CELLPADDING> 调整数据域位之边界 <TABLE CELLSPACING> 调整表格线得宽度 <TABLE HEIGHT> 调整表格得高度 <TABLE WIDTH> 调整表格得宽度 <TABLE>、、、</TABLE> 产生表格得卷标 <TD ALIGN> 调整表格字段之左右对齐 <TD BGCOLOR> 设定表格字段之背景颜色 <TD COLSPAN ROWSPAN> 表格字段得合并 <TD NOWRAP> 设定表格字段不换行 <TD VALIGN> 调整表格字段之上下对齐 <TD WIDTH> 调整表格字段宽度 <TD>、、、</TD> 定义表格得数据域位 <TEXTAREA NAME ROWS COLS> 窗体中加入多少列得文字输入栏 <TEXTAREA WRAP> 决定文字输入栏就是自动否换行 <TH>、、、</TH> 定义表格得标头字段 <TITLE> 文件标题 <TR>、、、</TR> 定义表格美一行 <UL TYPE>、、、</UL> 无序号得列表 ( 可指定符号 ) <VAR>、、、</VAR> 用于显示变量
展开阅读全文

开通  VIP会员、SVIP会员  优惠大
下载10份以上建议开通VIP会员
下载20份以上建议开通SVIP会员


开通VIP      成为共赢上传
相似文档                                   自信AI助手自信AI助手

当前位置:首页 > 教育专区 > 其他

移动网页_全站_页脚广告1

关于我们      便捷服务       自信AI       AI导航        抽奖活动

©2010-2025 宁波自信网络信息技术有限公司  版权所有

客服电话:4009-655-100  投诉/维权电话:18658249818

gongan.png浙公网安备33021202000488号   

icp.png浙ICP备2021020529号-1  |  浙B2-20240490  

关注我们 :微信公众号    抖音    微博    LOFTER 

客服