HTML5代码大全_第1页
HTML5代码大全_第2页
HTML5代码大全_第3页
HTML5代码大全_第4页
HTML5代码大全_第5页
免费预览已结束，剩余6页可下载查看

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、、HTML各种命令的代码:1、文本标签 （命令 ） <pre></pre> <h1></h1> <h6></h6> <b></b> <i></i> <tt></tt> <cite></cite> <em></em> <strong></strong> <font size=?></font> <font color=?></font>

2、 <img src="name"> <img src="name" align=?> <img src="name" border=?> <hr> <hr size=?> <hr width=?> <hr noshade>3、链接 （ 命令）<a href="URL"></a> <a href="mailto:EMAIL"></a> <a name="

3、;NAME"></a> <a href="#NAME"></a>4、格式排版 （ 命令 ） <p><p align=?> <br> <blockquote></blockquote> <dl></dl> <dt><dd> <ol></ol> <li> <ul></ul> <li> <div align=?>二、HTML基本语法创建预格

4、式化文本 创建最大的标题 创建最小的标题 创建黑体字 创建斜体字 创建打字机风格的字体 创建一个引用 , 通常是斜体 加重一个单词（通常是斜体加黑体） 加重一个单词（通常是斜体加黑体） 设置字体大小，从 1 到 7 设置字体的颜色 ,使用名字或十六进制值 2、图形 （命令） 添加一个图像排列对齐一个图像 : 左中右或上中下 设置围绕一个图像的边框的大小 加入一条水平线 设置水平线的大小（高度） 设置水平线的宽度（百分比或绝对像素点） 创建一个没有阴影的水平线创建一个超链接 创建一个自动发送电子邮件的链接 创建一个位于文档内部的靶位 创建一个指向位于文档内部靶位的链接创建一个新的段落 将段落按左

5、、 中、 右对齐 插入一个回车换行符 从两边缩进文本 创建一个定义列表 放在每个定义术语词之前 放在每个定义之前 创建一个标有数字的列表 放在每个数字列表项之前，并加上一个数字 创建一个标有圆点的列表 放在每个圆点列表项之前，并加上一个圆点 一个用来排版大块 HTML段落的标签，也用于格式化表文件格式 <html></html>（ 文件的开头与结尾 ） 主题 <title></title>（ 放在文件的开头 ）文头区段 <head></head>（ 描述文件的信息 ） 内文区段 <body></body&

6、gt;（ 放此文件的内容 ） 标题 <h?></h>（?=16, 改变标题字的大小 ） 标题对齐 <h align=right,left,center></h> 字加大 <big></big> 字变小 <small></small> 粗体字 <b></b> 斜体字 <i></i> 底线字 <u></u> 上标字 <sup></sup> 下标字 <sub></sub> 居中 <

7、center></center> 居左 <left> </left> 居右 <right> </right> 基本字体大小 <basefont size>（ 取值范围从 1 到 7，默认值为 3） 改变字体大小 <font size=?></font>（?=17） 字体颜色 <font color=#rrggbb></font>（RGB色码 ）指定字型 <font face=?></font>（?= 宋体，楷体等 ） 网址链结 <a hre

8、f="URL"></a> 设定锚点 <a name="?"></a>（? 以容易记为原则 ） 链结到锚点 <a href="#?"></a>（ 同一份文件 ） <a href="URL#?"></A>（ 锚点不同文件 ） 显示图形 <img src="URL"></a> 图形位置 <img src="URL" align=top,bottom,middle,

9、left,right>（ 分别为上、下、中、左、 右的位置 ） 图形取代文字 <img src="URL"alt=?>（ 无法显示图形时用 ） 图形尺寸 <img src="URL" width=? height=?>（?以像素为单位 ）连结图形边线 <img src="URL"border=?>（? 以像素为单位 ） 图形四周留白 <img src="URL"hspace=? vspace=?>（? 以像素为单位 ） 段落 <p></p>

10、; 断行 <br></br> 横线 <hr> 横线厚度 <hr size=?>（? 以像素为单位 ） 横线长度 <hr width=?>（? 以像素为单位 ） 横线长度 <hr width=?%>（? 与页宽相比较 ） 实横线 <hr noshade>（ 无立体效果 ） 背景图案 <body background= 图形文件名 >（ 图形文件格式为 gif 和 jpg） 背景颜色 <body bgcolor=#rrggbb>（RGB 色码 ） 背景文字颜色 <body text=#

11、rrggbb>（RGB 色码 ） 未链结点颜色 <body link=#rrggbb>（RGB 色码 ） 已链结点颜色 <body vlink=#rrggbb>（RGB 色码 ） 正在链结点颜色 <body alink=#rrggbb（RGB 色码 ）三、具体在做 html 文件前 , 我们还有哪些需要做的：1网页图象一般有什么要求？受网络传输速度制约，图象要尽量小。一般每幅最大不要20K。图象格式一般为gif和jpg两种。通常单调的可以考虑使用gif压缩。用jpg处理照片比较合适，因为里面包含许多色彩的缓和变化。不管是哪种，做好后都应压缩以给图片减肥，但不

12、要压得太多而失真。压缩可用JPEG OPtimiZer 或Image OPtimiZer 两种工具，若用PhotoShoP5.5做的图象，保存时直接用 SaVe For Web可进行压缩。另外， Gif格式可作成 动画。2、选择图片的网络存储空间建议各位卖家们事先可以找一个稳定的空间来存放你的图片，以确保你的买家随时可以看到精美漂亮的商品。 注意：不要把图片存放在免费相册里， 因为这些相册的路径一般都是 虚拟的，每一次浏览的 URL都会改变，这对我们卖家来说是非常不好的。另外要注意的一点是： 有一些买家反映看到的卖家商品的图片是小叉叉，这是因为一些卖家在用HTML粘贴图片的时候把自己电脑中 C

13、盘或者D盘（也就是本地路径）的图片的路径直接 直接复制在命令中，这样就会造成卖家自己可以看到这些图片而你的买家们看到的则是叉叉！所以卖家们在用HTML制作图片的时候一定要注意不要用本地路径直接粘贴图片！四、练习的例子：（红色字体部分即可修改成你自己的自定义）第一：用HTML来插入一个图片，<img src="http:/www.cyberhome.c n/images/girl/PLMM_A.jpg">Key:第二：用HTML来插入一个URL<a href="点击我进入 </a>Key:点击我进入第三：插入Url的同时，插入图片，点击

14、图片就可以进入这个Url ,如做一个插入网园淘艺坊的图片链接代码： Vahref="src="http:/www.cyberhome.c n/images/girl/PLMM_C.jpg"></a>Key:图片链接点击我进入第四：插入一段音乐高山流水： Vembed src="http:/www.cyberhome.c n/images/hill-water.mid" Width="72"height="25"autostart="false"loop="1

15、"alig n="absmiddle"Con trols="smallc On sole/PIaybUtt On/pausebutt On /stopbutt on"> <embed>Key:音乐链接点击我进入1.结构性定义文件类型<HTML><HTML> （放在档案的开头与文件主题 <TITLE></TITLE> （必须放在文头区块内） 文头<HEAD><HEAD> （描述性资料，像是主题）文体<BODY><BODY> （文件本体

16、）（由浏览器控制的显示风格）标题<H?></H?> （从1到6 ,有六层选择）标题的对齐 <H? ALlGN=LEFTlCENTERIRlGHT></H?>区分 <DIV><DIV>区分的对齐 <DlV ALlGN=LEFTlRlGHTlCENTERlJUSTlFY></DlV> 引文区块<BLOCKQUOTE></BLOCKQUOTE通常会内缩）强调 <EM></EM> （通常会以斜体显示）特别强调 <STRONG></STRONG（&g

17、t; 通常会以加粗显示）引文 <ClTE></ClTE> （通常会以斜体显示）码<CODE><CODE> （显示原始码之用）样本 <SAMP></SAMP>键盘输入 <KBD></KBD>变数 <VAR></VAR>定义 <DFN></DFN> （有些浏览器不提供）地址 <ADDRESS></ADDRESS>大字 <BlG></BlG>小字 <SMALL></SMALL>与外观相关

18、的标签（作者自订的表现方式）加粗 <B></B>斜体 <l></l>底线 <U></U> （尚有些浏览器不提供）删除线 <S></S> （尚有些浏览器不提供）下标 <SUB></SUB>上标 <SUP></SUP>打字机体 <TT></TT> （用单空格字型显示） 预定格式 <PRE></PRE> （保留文件中空格的大小）预定格式的宽度 <PRE WIDTH=?></PRE>（以字

19、元计算）向中看齐<CENTER></CENTER>（文字与图片都可以）闪耀 <BLINK></BLINK> （有史以来最被嘲弄的标签）字体大小 VFONT SIZE=?></FONT> （从 1 到 7）改变字体大小 <FONT SIZE=+|-?></FONT>基本字体大小 <BASEFONT SIZE=?> （从1到7; 内定为 3）字体颜色 <FONT COLOR="#$"></FONT>4. 特殊字元（以下标签需用小写）特别符号 &#

20、?; （其中 ? 代表 ISO 8859-1 的编码）< < > > & & " "注册商标 TM ?N1.0+ 注册商标 TM ?著作权符号 ?N1.0+ 著作权符号 ?5. 表单 （通常需要与 CGI 程式配合）定义表单 <FORM ACTION="URL" METHOD=GET|POST></FORM>N2.0 上传档案 <FORM ENCTYPE="multipart/form-data></FORM>输入栏位 <INPUT TYPE=&quo

21、t;TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET">栏位名称 <INPUT NAME="*">栏位内定值 <INPUT value="*">已选定 VlNPUT CHECKED> （适用於 CheCkboXeS 与 radio boxes ）栏位宽度 <INPUT SIZE=?> （以字元数为单位）最长字数 VlNPUT MAXLENGTH=?> （以字元数为单位）下拉式选单 VSELECT>V/SELECT>下拉式

22、选单名称 VSELECT NAME="*">V/SELECT>选单项目数量 <SELECT SIZE=?></SELECT>多选式选单 <SELECT MULTIPLE> （多选）选项 <OPTION>内定选项 <OPTION SELECTED>文字输入区 <TEXTAREA ROWS=? COLS=?></TEXTAREA>输入区名称 <TEXTAREA NAME="*"></TEXTAREA>N2.0 输入区换行方式 <TEX

23、TAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>6. 表格3.0 定义表格 <TABLE></TABLE>3.0 表格框线 <TABLE BoRDER><TABLE> （有或没有）N1.1表格框线<TABLE BORDER=?></TABLE（可以设定数值）N1.1 储存格左右留白 <TABLE CELLSPACING=?>N1.1 储存格上下留白 <TABLE CELLPADDING=?>N1.1 表格宽度 <TABLE WIDTH=?>

24、; （以 pixels 为单位）N1.1 宽度比率 <TABLE WIDTH=%（页宽为 100%3.0 表格列 <TR></TR>3.0 表格列内容看齐 <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>3.0 储存格 <TD></TD> （须与列并用）3.0 储存格内容看齐 <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>3.0 不换行 <TD NOWRAP>N3.0 储存格背景颜色 &l

25、t;TD BGCOLOR=#$>3.0 储存格横向连接 <TD COLSPAN=?>3.0 储存格纵向连接 <TD ROWSPAN=?>N1.1 储存格宽度 <TD WIDTH=?> （以 pixels 为单位）N1.1储存格宽度比率 <TD WIDTH=%> （页宽为100%3.0表格标题<TH><TH> （跟<TDk样，不过会对中并加粗）3.0 表格标题对齐 <TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>3.0 表格标题不换行 <

26、TH NOWRAP>3.0 表格标题占几栏 <TH COLSPAN=?>3.0 表格标题占几列 <TH ROWSPAN=?>N1.1 表格标题宽度 <TH WIDTH=?> （以 pixels 为单位）N1.1表格标题比率宽度 <TH WIDTH=%（页宽为100%）3.0 表格抬头 <CAPTION></CAPTION>3.0 表格抬头看齐 <CAPTION ALIGN=ToPIBoTToM>在表格之上/之下）视框定义与控制萤幕上的特定区域）N2.0视框格式总定义<FRAMESET></FR

27、AMESET（> 取代 <BoDY）>N2.0视框行长度分配<FRAMESET RoWS=,></FRAMESET（>pixels 或 %）N2.0视框行长度分配<FRAMESET RoWS=*></FRAMESE（T>* = 相对大小）N2.0视框栏宽度分配<FRAMESET CoLS=,></FRAMESET（> pixels 或 %）N2.0视框栏宽度分配<FRAMESET CoLS=*></FRAMESET（> * = 相对大小）N2.0定义个别视框<FRAME>

28、; （定义个别视框）N2.0个别视框内容 <FRAME SRC="URL">N2.0个别视框名称 <FRAME NAME="*"I_blankI_selfI_parentI_top>N2.0边缘宽度 <FRAME MARGlNWIDTH=?（左与右边界）N2.0边缘高度<FRAME MARGlNHEIGHT=?>（天顶与地底边界）N2.0卷动条 <FRAME SCRoLLING="YESINoIAUTo">N2.0不可改变大小 <FRAME NoRESIZE>N2.0无

29、视框时的内容<NOFRAMES></NOFRAMES>果浏览器不提供视框功能的话）2. 连结与图形连结 <A HREF="URL"></A>连结到锚点 <A HREF="URL#*"></A> （如果锚点在另一个档案）<A HREF="#*"></A> （如果锚点目前的档案）连结到目的视框 <A HREF="URL" TARGET="*"></A>设定锚点 <A NAME

30、="*"></A>图形 <IMG SRC="URL">图形看齐方式 <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE>图形看齐方式 <IMG SRC="URL" ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>取代文字 <IMG SRC="URL" ALT="*"> （如果没有办法显示图形则显示此文字） 点选图 <IM

31、G SRC="URL" ISMAP> （需要 CGI 程式）N2.0 点选图 <IMG SRC="URL" USEMAP="URL">N2.0 地图 <MAP NAME="*"></MAP> （描述地图）N2.0 段落 <AREA SHAPE="RECT" COORDS="," HREF="URL"|NOHREF>3.0 大小 <IMG SRC="URL"WIDTH="

32、;?" HEIGHT="?"（> 以 pixels 为单位） N1.0 图形边缘 <IMGSRC="URL" BoRDER=?>（以 PiXelS 为单位）N1.0 图形边缘空间 <IMG SRC="URL" HSPACE=? VSPACE=?> （以 PiXeIS 为单位）N1.0 低解析度图形 <IMG SRC="URL" LoWSRC="URL">N1.1 用户端拉 <META HTTP-EQUIV="RefreSh&qu

33、ot; C> （使用端自动更新 ）N2.0内嵌物件 <EMBED SRC="URL"> （将物件插入页面）N2.0 内嵌物件大小 <EMBED SRC="URL" WIDTH="?" HEIGHT="?">3. 分隔段落 <P> （通常是两个 return ）3.0 段落 <P></P> （新定义成容器型标签）3.0 文字看齐方式 <P ALIGN=LEFT|CENTER|RIGHT></P>换行 <BR> （一个

34、 return ）N1.0文字部份看齐方式 <BR CLEAR=LEFTIRIGHT|ALL>（与图形合用时）横线 <HR>N1.0 横线对齐 <HR ALIGN=LEFT|RIGHT|CENTER>N1.0 横线厚度 <HR SIZE=?> （以 PiXelS 为单位）N1.0 横线宽度 <HR WIDTH=?> （以 PiXelS 为单位）N1.0横线比率宽度 <HR WIDTH=%（以页宽为100%）N1.0实线<HR NoSHADE> （没有立体效果）N1.0不可换行<NOBR><NOBR&

35、gt; （不换行）N1.0 可换行处 <WBR> （如果需要，可在此断行）列举 （可以巢状列举）无次序式列举 <UL><LI><UL>（ <LI> 放在每一项前）N1.0 公布式列举 <UL TYPE=DISC|CIRCLE|SQUARE（> 定义全部的列举项）<LI TYPE=DISClClRCLElSQUARE>（定义这个及其後的列举项） 有次序式列举 <OL><LI><OL>（ <LI> 放在每一项前）N1.0 数标型态 <OL TYPE=AlalIl

36、il1> （定义全部的列举项）<LI TYPE=AlalIlil1> （定义这个及其後的列举项）N1.0 起始数字 <OL value=?> （定义全部的列举项）<LI value=?> （定义这个及其後的列举项）定义式列举 <DL><DT><DD><DL>（ <DT>项目,<DD> 定义）表单式列举 <MENU><LI><MENU（> <LI> 放在每一项前）目录式列举 <DIR><LI><DIR>

37、; （ <LI> 放在每一项前）背景与颜色3.0 重复排列的背景 <BODY BACKGROUND="URL">N1.1+ 背景颜色 <BODY BGCOLOR="#$"> （依序为红、绿、蓝）N1.1+ 文字颜色 <BODY TEXT="#$">N1.1+ 连结颜色 <BODY LINK="#$">N1.1+ 看过的连结 <BODY VLINK="#$">N1.1 使用中的连结 <BODY ALINK="#$">7. 杂项说明 <!- * ->（浏览器不会显示）<!- 修改滚动条 -> <style type="textcss">body scrollbar-face

人人文库> 全部分类> 应用文书 > 作业报告

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论