词条 | HTML简介 |
释义 | 1. 文档结构 语言声明(.html文件没有) <%@ Page Language="C#" %> 文档类型声明 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 动态语句代码 (动态代码编辑人员) <script runat="server"> </script> Html结构 <html xmlns="http://www.w3.org/1999/xhtml" > 头 <head runat="server"> 字符集 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 标题 <title>无标题页</title> 样式表 <!--内嵌样式表--> <style type="text/css"> <!-- body,td,th { color: #FF0000; } --> </style> <!--外部样式表--> <link href="../StyleSheet.css" rel="stylesheet" type="text/css" /> </head> 主体 <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html> 2. 基本语法 1) 标签结构 <标签名 属性=”” 动作=””></标签名> 2) URL URL分为两种:相对地址和绝对地址,在设计页面时必须使用相对地址。 /代表本级目录下 ../代表上级目录下 ~/代表根目录下 3) 颜色 可以由两种表达方式:颜色名称和RGB值,为了页面颜色更加美观,请使用RGB值表示法,即 #RRGGBB RR GG BB分别代表红黄蓝三种颜色的值,采用16进制表示,如#9966CC 4) 长度 长度可以有两种表达方式,像素和百分比。如果需要固定长度请使用像素,如果需要可变长度(如可变表格),请使用百分比。 3. 代码规范 1.所有的标记都必须要有一个相应的结束标记。(如:<p></p>) 2.所有标签的元素和属性的名字都必须使用小写(与HTML不一样,XHTML对大小写是敏感的) 3.所有的XML标记都必须合理嵌套,一层一层的嵌套必须是严格对称,不能交叉。(html规范可以交叉) 4.所有的属性必须用引号""括起来。(在HTML中,你可以不需要给属性值加引号) 特殊情况,你需要在属性值里使用双引号,你可以用",单引号可以使用',例如: <alt="say'hello'"> 5.把所有<和&特殊符号用编码表示 任何小于号(<),不是标签的一部分,都必须被编码为& l t ; 任何大于号(>),不是标签的一部分,都必须被编码为& g t ; 任何与号(&),不是实体的一部分的,都必须被编码为& a m p; 注:以上字符之间无空格。 6.给所有属性赋一个值 XHTML规定所有属性都必须有一个值,没有值的就重复本身 7.不要在注释内容中使“--” “--”只能发生在XHTML注释的开头和结束,也就是说,在内容中它们不再有效。例如下面的代码是无效的: <!--这里是注释-----------这里是注释--> 用等号或者空格替换内部的虚线。 <!--这里是注释============这里是注释--> 8.请在代码书写的时候尽量使用缩进表明层次关系 4. 标签列表 基本标签: <!DOCTYPE>:文档类型 <html>:html文档 <body>:body元素 <h1> to <h6>:标题1 -- 标题6 <p>:段落 <br />:换行 <hr />:水平线 <!--...-->:注释 文字格式: <b>:粗体文本 <font>:文字的外观,大小和颜色 <i>:文本为斜体 <em>:文本为重要 <big>:文本增大 <strong>:文本为非常重要 <small>:文本缩小 <sup>:文本上标 <sub>:文本下标 <bdo>:文字方向 <u>:文本下划线 输出: <pre>:预先格式(保留文件中空格的大小) <code>:码(显示源码用) <tt>:打印机字体 <kbd>:键盘 <dfn>:定义 <var>:变数 <samp>:样本 <xmp>:不赞成使用,使用<pre>代替 结构性定义: <acronym>:只取首字母的缩写词 <abbr>:缩写 <address>:地址 <blockquote>:引文区块 <center>:句中对齐 <q>:引用短语 <cite>:引文 <ins>:插入 < del>:删除 <s>:删除线 <strike>:删除线 链接: <a>:链接 <link>:资源参考 框架: <frame>:定义个别视框 <frameset>:视框格式总定义 <noframes>:无视框时的内容 <iframe>:定义嵌入视图 输入: <form>:定义表单 <input />:定义输入域 <textarea>:输入区换行方式 <button>:按钮 <select>:下拉式选单 <optgroup>:选项组 <option>:列表选项 <label>:标签(用于表单控制) <fieldset>:域 <legend>:域标题 <isindex>:不建议使用(可搜寻,使用input代替) 列举: <ul>:无次序式列举 <ol>:有次序式列举 <li>:每条项目列表 <dir>:目录式列举 <dl>:定义式列举 <dt>:定义项目 <dd>:定义说明 <menu>:菜单列表 图片: <img />:图片 <map>:图片地图 <area />:图片热点 表格: <table>:表格 <caption>:表格抬头 <th>:表格标题 <tr>:行 <td>:单元格(列) <thead>:定义表格头 <tbody>:定义表格主体 <tfoot>:定义表格脚 <col>:定义特有特征 <colgroup>:定义特征集合 样式: <style>:样式定义 <div>:在文档中定义一个区域 <span>:在文档中定义一个区域 头信息: <head>:定语关于文档的信息 <title>:定义文档标题 <meta>:定义背景资讯 <base />:基本文档中所有链接的基准 <basefont />:定义基本字体 脚本、引用外部对象相关: <script>:定义脚本 <noscript>:定义无脚本的显示区域 <applet>:定义java程序 <object>:定义内嵌对象 <param>:定义对象的参 5. 常用属性 class:Css风格 name:名称 width:宽 height:高 color:颜色 bgcolor:背景颜色 align:水平对齐 valign:垂直对齐 style:风格(建议使用class代替) clospan:合并的列数,表格专用 rowspan:合并的行数,表格专用 scr:图片等对象的地址 href:超级链接地址 target:超级链接打开方式 6. 常用代码举例 1) 页面设置 <body background="背景图" bgcolor="背景颜色" alink="链接颜色" leftmargin="左边距" text="字体颜色">也可以直接用样式表 2) 超级链接 <a href="链接地址" target="打开目标窗口,如_blank">链接文字</a> 3) 表格 <table> <tr> <td width="100">单元格</td> <td width="150">单元格</td> <td rowspan="3">行合并单元格</td> </tr> <tr> <td colspan="2">列合并单元格</td> </tr> <tr> <td> </td> <td> </td> </tr> </table> 单元格1 单元格2 行合并单元格 列合并单元格 4) 列表 <ol> <li>列表项</li> <ul><li>列表项.1</li></ul> </ol> 列表项1 列表项1.1 5) 嵌入图片 <img src="图片地址" width="图片宽度" height="图片高度"/> 6) 嵌入对象 Flash <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="560" height="520"> <param name="movie" value="flash地址" /> <param name="quality" value="high" /> <embed src="flash地址" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="560" height="520"></embed> </object> 7) 字体格式 <font size="3">字大为</font> <font color="red">红色字体</font> <strong>加粗字体</strong> <i>斜体字</i> <u>下划线</u> <s>删除线</s> 8) 移动文字 <marquee direction="left" loop="-1">滚动文字</marquee> 9) 插入层 <div style="width: 100px; height: 100px">层</div> |
随便看 |
百科全书收录594082条中文百科知识,基本涵盖了大多数领域的百科知识,是一部内容开放、自由的电子版百科全书。