HTML网页制作基础

HTML网页制作基础HTML文档的结构示例：HTMLHEADtitle标题部分/title/HEADBODY我的第一个html页面/BODY/HTMLhead元素出现在文档的开头部分。head与/head之间的内容不会在浏览器的文档窗口中显示，但是其之间可以嵌入javascript和css样式等丰富网页的内容。metahttp-equiv=Content-Typecontent=text/html;charset=gb2312/用来标记你的页面的解码方式。title元素定义HTML文档的标题。title与/title之间的内容将显示在浏览器窗口的标题栏。body元素表明是HTML文档的主体部分。在body与/body之间，通常都会有很多其它元素；这些元素和元素属性构成HTML文档的主体部分。BODY元素的属性概述1.Bgcolor属性标志HTML文档的背景颜色。如:Bgcolor=“＃RRGGBB”示例：HTMLHEADtitle标题部分/title/HEADBODYbgcolor=red背影色设置为灰色/BODY/HTML2.background属性设置背景图片可使用GIF，JPG示例：HTMLHEADtitle标题部分/title/HEADBODYbackground=fengjing2_006.jpg设置背景图片br/BODY/HTML3.bgproperties=“fixed”使背景图片成固定效果，图片不随滚动条滚动。示例：HTMLHEADtitle标题部分/title/HEADBODYbackground=fengjing2_006.jpgbgproperties=fixedbgproperties=fixedbrbrbgproperties设置为fixed图片不随着滚动条而滚动。br/BODY/HTML4.text设置非链接文字的色彩。5.link、vlink、alink分别对应普通超级链接、访问过的超级链接、当前活动超级链接颜色。示例：HTMLHEADtitle标题部分/title/HEADBODYalink=redlink=pinkvlink=greenahref=点击进入/aahref=点击进入/a/BODY/HTML6.leftmargin和topmargin页面左边的空白距与上边的空白距。HTML文字设置1文字是网页设计的基础部分，设置好文字的样式，可以起到事半功倍的效果，通常可以使用两种方法。第1种方法是直接使用HTML标记进行设置，如:使用粗体标记B将文本设置为加粗样式。第2种方法是使用css，层叠样式表。HTML定义了6级标题，1-6级，标题文字随级数增大依次减小。h1h1的效果/h1h2h2的效果/h2h3h3的效果/h3h4h4的效果/h4h5h5的效果/h5h6h6的效果/h6示例：HTMLHEADtitle标题部分/title/HEADBODYh1h1的效果/h1h2h2的效果/h2h3h3的效果/h3h4h4的效果/h4h5h5的效果/h5h6h6的效果/h6/BODY/HTML利用align属性可以实现标题文字水平方向左、中、右的对齐方式。align=“left/center/right”示例：HTMLHEADtitle标题部分/title/HEADBODYh1align=leftright的效果/h1h2align=centercenter的效果/h2h3align=rightleft的效果/h3/BODY/HTMLHTML文字设置2B设置文字以粗体的方式显示。语法B…/BI设置文字以斜体显示。语法I…/IEM效果同l语法EM…/EMSUP设置文字以上标文本效果显示。语法SUP…/SUPSUB设置文字以下标文本效果显示。语法SUB…/SUBU设置文字以下划线显示。语法U…/US设置文字以删除线显示。语法S…/S示例：HTMLHEADtitle标题部分/title/HEADBODYB粗体/BbrI斜体/IbrEM斜体/EMbr字体SUP上标/SUPbr字体SUB下标/SUBbrU下划线/UbrS删除线/Sbr/BODY/HTMLFONT控制的字体、大小和文字。语法：FONTface=“字体”,size=“文字大小”,color=“颜色值”…/FONTface控制文字使用的字体size控制文字的大小color设置文字颜色HTML段落设置P段落标记，一般情况下在每个段落的前面加上一个P标记可以区分段落，又可以换行。BR之后的文字将在下一行显视。HR设置水平线。center标记所有包含的内容，将以居中对齐的方式显示在网页中。PRE标签可以把原文件中的空格,回车,换行,tab键表现出来NOBR标记将取消浏览器由于窗口大小变化而换行。XMP在HTML文档中加入XMP标记，使标记内的HTML标记不起作用。示例：HTMLHEADtitle标题部分/title/HEADBODY这是一个段落标记。<p>p这是一个<br>brhrcenter居中显示/centerbrPREabc#sdfsd%#%defg!sdfsads$!@$(h$#@#%%idsfasfjk/PRE天空在不断的变暗但在玻璃窗的边缘留下了一丝宝石的蓝那样的深邃像大海深处的暗淡那样的忧郁像我心底深处的盘旋多么渴望留住这一丝这最后的暗淡宝石的蓝可时间的蔓延总要将它消逝然后变得黑暗无边NOBR天空在不断的变暗但在玻璃窗的边缘留下了一丝宝石的蓝那样的深邃像大海深处的暗淡那样的忧郁像我心底深处的盘旋多么渴望留住这一丝这最后的暗淡宝石的蓝可时间的蔓延总要将它消逝然后变得黑暗无边/NOBRXMPHTMLHEADtitle标题部分/title/HEADBODY这是一个段落标记。<p>p这是一个<br>brhrcenter居中显示/centerbr/XMP/BODY/HTMLHTML的转义字符--HTML跑动文MARQUEE标记可使文字产生跑动的效果direction文字走动方向bgcolor设置文字背景颜色height设置跑动文字的高度width设置跑动文字的宽度hspace设置文字的水平边距vspace设置文字的上边距behavior设置文字的运动方式scroll/alternate/slideloop设置跑动文字的圈数scrollamount设置跑动文字移动速度scrolldelay设置跑动文字移动延时示例：HTMLHEADtitle标题部分/title/HEADBODYMARQUEE文字/MARQUEE/BODY/HTML示例：HTMLHEADtitle标题部分/title/HEADBODY"br<br>br±br×br&br§br¢br¥br·br€br£br™br©br®/BODY/HTMLHTML超链接超链接是一个网站的重要元素之一，一个网站由多个页面组成，各页面之间是通过超链接来确定相互关系的，每个页面的地址都不同。格式:A这是一个连接/Ahref设置超链接目标地址URLname在html文档中建立特定位置的名称target设置被链接的网页打开时的窗口_blank/_parent/_self/_topaccesskey设置超链接的快捷键title设置超链接的说明文字style运用css样式设置超链接文字样式示例：HTMLHEADtitle标题部分/title/HEADBODYahref=../07-a.htmlname=07htmltarget=_blanktitle=说明文字accesskey=qhtml链接/a/BODY/HTMLHTML超链接的锚点是指同一页面中的不同位置链接。一个网页的内容很长，我们就可以在网页的顶部设置一些锚点，这样便可以方便浏览者点击相应的锚点，到达本页内相应的位置，而不必在一个很长的网页里自行寻找。示例：HTMLHEADtitle标题部分/title/HEADBODYaname=top/a08-A.htmlhrahref=08-a.html#abcname=cba页面内的锚点1-_-/abrbrbrbrbrbrbrbrbrbrbrbrahref=08-b.html#08bname=08a页面外的锚点1…………/abrbrbrbrbrbrbrbrbrbrbrbrahref=08-a.html#cbaname=abc页面内的锚点2/abrbrbrbrbrbrbrbrbrbrbrbrahref=#top返回顶部/a/BODY/HTMLHTML有序列表列表分成三种类型：有序列表、无序列表和自定义列表。有序列表使用编号来记录项目的顺序，无序列表使用项目符号来记录无序的项目，自定义列表它由两个部分组成：定义条件和定义描述。OLtype=编号样式start=编号起始值LI项目一/LILI项目二/LI..../OLtype1阿拉伯数字a英文小写A英文大写i罗马小写数字I罗马大写数字start编号样式的起始数字，如：编号样式设为A，起始值设置为2，则列表的起始值为B.示例：htmlheadtitle标题/title/headbodyDLDT☆DD无序列表/DDDT☆DD有序列表/DDDT☆DD定义列表/DD/DLDLDT无序列表/DTDD不以数字为开始，而是使用一个符号作为分项标记的列表。/DDDT有序列表/DTDD使用数字编号，分项带有顺序性质的列表。/DDDT定义列表/DTDD用于解释名词的列表，包含了两种层次，一是名词，一是名词的解释。/DD/DL/body/htmlHTML无序列表无序列表标记ULLI项目一/LILI项目二/LI..../ULtypecircle空心圆disc圆点square正方形示例：htmlheadtitle标题/title/headbodyoltype=Istart=2li啊啊/lili啊啊/lili啊啊/lili啊啊/li/ol/body/htmlHTM自定义列表DLDT无序列表/DTDD不以数字为开始，而是使用一个符号作为分项标记的列表。/DDDT有