項目分發(fā)給學生a9-html語言入門教程_第1頁
項目分發(fā)給學生a9-html語言入門教程_第2頁
項目分發(fā)給學生a9-html語言入門教程_第3頁
項目分發(fā)給學生a9-html語言入門教程_第4頁
項目分發(fā)給學生a9-html語言入門教程_第5頁
已閱讀5頁,還剩42頁未讀 繼續(xù)免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權,請進行舉報或認領

文檔簡介

HTML語言入門(一什么是HTML語HTML(HyperTextMarkUpLanguage)是使用特殊標記來描述文檔結構和表現(xiàn)形式的一種語言,由W3C(WorldWideWebConsortium)所制定和更新。我們可以用任何一種文本編譯起來編輯HTML文HTML語言的基本結下面我們來看一小段HTML語言的代碼,來了解HTML語言的基本結構將這一小段代碼粘貼至文本文件中,然后選擇“另存為”,將文件的后綴名改為.htm或者.html即可, 下就可看到一個IE的圖標,名字就是你所存的文件名稱。 這是HTML文件的語法格式。每一個HTML文件,都必須以<HTML>開頭,以</HTML>結 這是文件 注意:幾乎每一種HTML語言的語法都是以<>開頭,以</>結束。在編輯HTML語言過程中,也可以使用注釋。語法格式為:<!-文件注釋->C語言中的/*…………*/一樣,中間的內(nèi)容只是解釋HTML語言的基本單<hr <hr 其中<hr>標記是在頁面上建立水平線的標記。width是水平線元素中的一種屬性,用來表示水平線的寬度。這里width="500"即表示這個水平線的寬度是500像素;width="%50"即表示水平線占據(jù)客法:16進制顏色代碼、10進制RGB碼、直接顏色名稱。這三種表示方法不同,但是效注意:Unicode字符型進行保存16RRGB16號,00F。10進制RGBRGB(RRR,GGG,BBB。在這種表示法中,后面三準是16進制與10進制的相互轉(zhuǎn)換。URL(UniversalResourceLocator)路徑是一種互聯(lián)網(wǎng)地址的表示法。在這個數(shù)據(jù)里可以包括以何種名稱等信息。在HTML中,URL路徑分為兩種形式:絕對路經(jīng)和相對路徑。 語法格式:<scheme>:<scheme_dependent_information>其中,<scheme><scheme_dependent_information>則是連接的位置例如<a<a<a相對路徑是相對于當前的HTML文檔所在 語法格式:相對關系/部分路徑/文件名 例如當前文檔的路徑是:test/project1/index.htm。我們要找test 下的html.htm。而當前 是project1,我們要回到上一級 例如<a<a這一課我給大家介紹html文檔中head部分的基本使用方法head這一部分是由標記<head>開始,以標記</head>結束,是html文檔的首要部分。下面我們看一下head部分所包含的元素:文檔標描述非html標準的一些文檔信程序內(nèi)<title> meta元素提供的信息是用戶不可見的。下面是meta的幾種用法:<meta<meta"content(內(nèi)容)都是看到的版本,那么就在網(wǎng)頁上加上這一句吧!<meta<metahttp-equiv="content-type"G2替換為BG5刷新頁<meta<metahttp-這樣的語句可以讓我們的瀏覽器按照content屬性中制定的時間來跳轉(zhuǎn)到URL屬性中設定的URL地址。上面的例子就是在打開頁面60秒后調(diào)用一個新的頁面new.htm。如果沒有能夠找到new.htm,瀏<link<linkrel="描述href="URL地址<link<linkrel="stylesheet"關于css<base<basehref="原始地址target="目標窗口名稱href指定文檔中到的所有文件默認的URL地址。在這里指定href的屬性,所有的相對路徑的前面都會加上href屬性中的值。target指定文檔中所有的默認打開窗口。最常見的應用是在框架頁(frame)中。我們要把框架中的聯(lián)接顯示到content框架中,就可以在的網(wǎng)頁中加上<basetarget="content">。這樣,就省去了在網(wǎng)頁上所有的<a>屬性上加上target屬性了。<script 在language中一定要指定語言的種類。如VBScript等用來指定當前文檔的css層疊樣式表。css對于網(wǎng)頁的字體樣式、背景、邊界等都有很大的應用。詳細部分請大家參閱css有關內(nèi)容。這一次我給大家介紹html語言中的body的部分用法絕對主要部分。body是由<body>開始,由</body>結束。下面我們看一下body部分的元素:背景圖文本顏文字顏活動文字顏bgcolor用于指定頁面的背景顏色。在公司的IE瀏覽器中,默認情況下是白色,Netscape公司的Navigator瀏覽器的默認情況是灰色。<body<bodybgcolor="顏色值background屬性用于指定頁面的背景圖案。<body<bodytextlinkalinkvlinkleftmargin<body<bodytext="color"link="color"alink="color"<bodyleftmargin="value"<bodybgcolor="#ff0000"text="#ffff00"<p>這里顯示body的示例。說明:對于link這樣的屬性,大多數(shù)html的頁面已經(jīng)不使用這樣的用法了?,F(xiàn)在多數(shù)是在head中加入A:link{color:#00007f;}A:visitedA:link{color:#00007f;}A:visited{color:#65038e;}A:active{color:#ff0000;}A:hover將這段代碼加入到head中,在body中加入有的文字,就可以看出效果了。這一部分是屬于css中的知識。在body中加入有的文字:在Dreamweaver中,選定文字后,在下面的Properties中的link中加入想要到的頁面的地址。在FrontPage中,選定文字后,點擊右鍵就會有相應的選項。第一課HtmlHyperTextMarkupLanguage的文件(文檔)的擴展名是.htmlhtm,它們是可供字板或FrontPageEditorHtmlHtml當我們暢游Internet時,我們透過瀏覽器所看到的,是由HTML(HyperTextMarkupLanguage)言所構成。HTML文件標記語言HTML記是由住的指令,主要分為記指令、雙標記指令始標記束標記所HTML頁文件可由任何文本編輯器或網(wǎng)頁編輯器編輯完成后(以.htm.html文件后綴保存HTML頁文件由瀏覽器打開顯示,若測試沒有問題則可以放到服務器(Server)上,對外發(fā)布信息。HTML<HTML>開<HEAD>區(qū)開<TITLE>...</TITLE>題</HEAD>區(qū)結<BODY>區(qū)開始</BODY>區(qū)結</HTML>結<HTML>文件格<HEAD>文件基本資料,如作者、編寫時間<TITLE>件標題須使用在標頭區(qū)內(nèi),可以在瀏覽器最上看到標題<BODY>本文區(qū):文件資料,即在瀏覽器上看到的內(nèi)容。通常HTML頁文件包含二個<HEAD>...</HEAD區(qū)、<BODY>...</BODY文區(qū)。而<HTML></HTML>網(wǎng)頁文習慣上一個的首頁名稱通常訂為index.htm或這樣只要瀏覽,瀏覽器便會自動的找出index.htm文件<hn>...</hn>題,設定標題字體大n1~6<h2>標<h3aligncenter>題</h3>題置中標<b>...</b>體字<b>體字粗體<i>...</i>斜體字。如<i>體字斜體<del>...</del>線示如:<del>橫線</del><tt>...</tt>字體定寬度文字<tt>字體<sup>...</sup>字體sup>字體上標<sub>...</sub>字體sub>字體下標解會顯示在瀏覽器上可以多行日期表格是html面更加整齊美觀。<table>...</table>格指令。相關屬性:·align·bgcolor景顏·border·height·width<caption>...</caption>格標題。相關屬性:·align<tr>...</tr>格列</tr>可省略相關屬性·align<th>...</th>表格欄標題體字</th>可省略相關屬性:·align·colspan·rowspan<td>...</td>表格欄資料(格)(</td>可省略)。相關屬性:·align·bgcolor景顏·height·width·colspan·rowspan舉<tableborder=1<tr><td>太平洋網(wǎng)絡學院<td>太平洋網(wǎng)絡學<tr><td>太平洋網(wǎng)絡學院<td>太平洋網(wǎng)絡學太平洋網(wǎng)絡太平洋網(wǎng)絡太平洋網(wǎng)絡太平洋網(wǎng)絡<tableborder=1align=center<caption>表格標題<tr><td><thcolspan=2>行標題1<thcolspan=2>行標題<tr><throwspan=2>列標題1td>a<td>a<td>a<tr><td>b<td>b<td>b<tr><throwspan=2>列標題2td>c<td>c<td>c<tr><td>d<td>d<td>d表格標行標題行標題列標題aaaabbbb列標題ccccdddd第四課html提供許多種類的標示標記,作項目標示,而且可以作巢狀式標示!<li>示項目<li>第一<li>第二<ol>...</ol>號標示,可標示數(shù)字或英文、羅馬字母。如:<ol<li>第一<li>第二<ul>...</ul>號標示,可標示數(shù)字或英文、羅馬字母。如:<li>第一<li>第二<dt>義項目<dd>義資料<dl>...</dl>義標示<dt>十進制:<dd><dt>十六:<dda、b、c、d、e、十六進制:a、b、c、d、e、f<ol><li>第一 <ol <li>第一 <li>第一 <li>第段 <li>第二 </ol><li>第二章<li>三章第一第一第一第二第二第二第三 式標示動加網(wǎng)絡學院<li>新手上<li>軟件教<li>設計教<li>開發(fā)教網(wǎng)絡學院新手上軟件教設計教標示項目符號也可以用<font>...</font>標記號字元(、◎、★、■...等示:<fontcolor=#ff0000>font>特殊符號:在html文件中,有些符號是代表特定的意義的。所以當我們要使符替代指""&&或<<>>不可分空&一個不僅要內(nèi)容豐富外,也要有美觀簡潔的版面。html所提供常用區(qū)段標<hr>生水平線<hraling=certen<br>下一行平洋網(wǎng)絡學院,<br>網(wǎng)上學電腦的好去處。網(wǎng)上學電腦的好去處<p>...</p>落,跳下一行并加一行空白。</p>省略平洋網(wǎng)絡學院,<p>網(wǎng)上學電腦的好去處。網(wǎng)上學電腦的好去處<center>...</center>中。如:<center>置中</center>置<nobr>...</nobr>不跳下一行<nobr>太平洋網(wǎng)絡學院,</nobr>網(wǎng)上學電腦的好去處。<pre>...</pre>件原始格式顯示。如:<pre>原始格式:文件</pre>原始格式 文第六可說是html中最重要的功能!因為html擁有的功能,你能接上internet、www受多姿多彩的網(wǎng)絡世界。基本上分成:外部——至網(wǎng)絡的某個url或文件可參考考網(wǎng)絡方內(nèi)部——html文件的某個區(qū)段。網(wǎng)絡方式://主機名稱/路徑/文件名稱如:http: 文件傳輸如:ftp: gropher傳輸如:gropher: 遠端登入如:net: 文件如:file://data/html/file.zipnetnews傳輸如:news:e-mail如:mailto 常用標<base>基本url置或路徑,以後只要設定文件名稱即會自動加相關屬性·href的url位址或文·target指定到的url位址或文件顯示于那一個視窗(可<frame>標記配合使用或開新的視窗<basehref="http <a<basehref="http .cn/"<a>...</a>指令。相關屬性:·href的url位址或文·name·target指定到的url位址或文件顯示于那一個視窗(可<frame>標記配合使用或開新的視窗外<ahref="http <ahref="http .cn/"第六課內(nèi)·ch1.htm<ahref=#a>■</a>(欲至html文件a點<aname=a>■</a>html件a·ch2.htm文<ahref=ch1.htm#a>■</a>(欲至ch1.htm文件a點"■"表示點,可以是文字或圖案。(即游標移到時,會變成手指形狀的地方)<link>指令(用于head區(qū),設定css文件)。<meta>應用資訊,可設定時間載入網(wǎng)頁(用于head。相關屬性·charset·content應表頭資料內(nèi)容是數(shù)字表示秒·http-equiv應定為refresh入url·urlhtml·設定中文自動跳行<metahttp-equiv="content-type"·設定十秒回到首頁。不html件位置則再載入原h(huán)tml件)<metahttp-equiv="refresh"content=10設定、未部份顏相關屬性:·alink按下部份未放開時顏·link未看過的部份顏·vlink已看過的部份顏<bodylink=#0000ffalink=#ff0000第八課有關設定的方法共有以下幾種設定html文件背景、背景顏色。<body>...</body>標記。如:<bodybackground=a.gif>...</body>或<body設定。<img>標記<img>相關屬性·align·alt示·border·height·srcurl·usemap圖名·width如:可(gif、jpg格式)、avi<imgsrc="../../../images/pcedu_lo.gif"alt="太平洋網(wǎng)align=top<map>...</map>相關屬性:·name<area>地圖動作區(qū)域相關屬性:·coords定動作區(qū)域座標上角x1,y1下角座標x2,y2)·href區(qū)域連入位址或文件·nohref動作區(qū)域連結點不動·shape設定地<imgborder=0src=a.gif<map<areashape=rectcoords=0,0,200,100<areashape=rectcoords=0,100,200,200<areashape=rectcoords=0,200,200,300html不僅能,也可以載入midi音樂、wav音效喔!<bgsound>景音樂相關屬性·loop循環(huán),背景音樂次·srcurl址可為wav、midi式<bgsoundsrc=m-1.mid內(nèi)嵌音樂插<embed>...</embed>嵌插件。相關屬性:·height·width度百分比·src定內(nèi)嵌物件的url·loop循環(huán),背景音樂次·autostart<embedsrc=m-1.midwidth=145height=60autostart=true第十課動這是由ie提供的滾動條,可不要被眾多的屬性嚇到了,越多的屬性功【文字卷動標記<marquee>...</marquee>字動條【相關屬性·behavior定卷動方alternate替來回卷scrollslide·bgcolorcolor景顏·direction定卷動方·heightn·loopn循環(huán)動次數(shù)設·scrollamountn定卷動·scrolldelaymilliseconds定卷動時·truespeedmilliseconds定卷動速·widthn寬度設百分【舉例如:<marqueebgcolor=redbehavior=alternatedirection=leftscrollamout=10scrolldelay=100><fontcolor=white>太平洋網(wǎng)絡學如:<marqueebgcolor=greenheight=50behavior=scrolldirection=upscrollamout=10scrolldelay=300><fonthtmltable,tbody,tr,td稱為html的,以雙的形式出現(xiàn),所謂雙一般都為雙。最終所顯示的網(wǎng)頁效果由各個屬性來表達屬性可選擇使用不一定全部都用在整個或帖子里雙以首尾呼應的方式出現(xiàn)。<tablealign=centerbackground="背景地址"border=0cellpadding=0cellspacing=0bordercolor=#0000ffwidth="100%">這里是,文字或帖子內(nèi)容<table>用參數(shù)設定<tablewidth="400"border="1"cellspacing="2"cellpadding="2"align="center"valign="top"background="myweb.gif"bgcolor="#0000ff"bordercolor="#cf0000"bordercolorlight="#00ff00"bordercolordark="#00ffff">表格寬度,接受絕對值(如width=80)及相對值(width=80%)表格邊框的厚度,不同瀏覽器有不同的內(nèi)定值表格格線的表格的擺放位置(水平),可選值為left(居左right(居右),表格內(nèi)內(nèi)容的對齊方式(垂直),可選值top,middle,bottom表格的背景,與bgcolor不要同用表格的背景顏色,與background要表格邊框顏表格邊框向光部分的表格邊框背光部分的顏色,使用bordercolorlightbordercolordarkbordercolor失效器寬度widthheight的值根據(jù)需要自圖格帖圖基本代碼如下<imgsrc="連接url地址<img>圖形標記,主要用來插入圖形標記。三文字設制基本代碼如<palign=center><fontcolor=#0066ffface=隸書size=5>插入文align=center表示字體居中,可選值為居右(right)居左color=顏色face=字體常用字體為:宋體.黑體.楷體.仿宋.幻緣.新宋體.細明體size=字體大小,這里的最大7取值越大文字就越大四加入音樂<embedsrc="音樂文件地址常用屬性如設定midi及路徑,可以是相對或絕對是否在音樂檔完之后就自動。true是,false否(內(nèi)定值)是否自動反復。loop=2表示重復兩次,true是,false否是否完全隱藏控制畫面,true是,no否內(nèi)定starttime="分:秒設定歌曲開始的時間如starttime="00:30"表示從第30秒處開volume="0-設定音量的大小,數(shù)值是0到100之間。內(nèi)定則為使用系統(tǒng)本身的設width="整數(shù)high="整數(shù)設定控制面板的高度和寬度。(若設定控制面板和旁邊文字的對齊方式,其值可以是top、bottomcenter、baseline、left、right、texttop、middle、absmiddle、設定控制面板的外觀。預設值是console。console一般正常面板smallconsole較小的面板playbutton只顯示按鈕pausecutton只顯示暫停按鈕stopbutton只顯示停止按鈕volumelever顯示音量調(diào)節(jié)按鈕貼音樂的完整語法如一:隱藏<embedsrc="音樂文件地址"hidden=trueautostart=true二:不隱藏<embedsrc="音樂文件地址width=""<TITLE>我的頁面1-名改成.html,一個網(wǎng)頁就誕生了。這就是HTML語言,它不象C++,VB等等程序語言要你摸不清頭腦,HTML語言只是一個在SGML定義下的描述性語言,或者說HTML任何標識都應該寫在"<"和">"之間,如事實上你已經(jīng)見過了這些標識,沒錯就是<HTML>;<HEAD>;<BODY><TITLE> HTMLHTML<html> HTML<body>.</body 1-1HTML<body>具有參數(shù)設定,我們就通過<BODYtext=""link=""alink=""vlink=""background=""bgcolor=""leftmargin=topmargin=bgproperties="fixed">設定連結后的顏色。(被按過)這里需要說明的是色彩的問題,色彩是用1616進制的數(shù)碼有:0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.#000000,其中紅=00,藍=00,綠=00,#0000FF,其中紅=00,綠=00,藍=ff,FLASH這兩個標識都是用于控制字體的大小,色彩,字體,但<basefont>html<title>H.SWorkshop</title><basefontface="Arial"size="7"歡迎來到<fontface="Arial"size="5"color="ff0000">H.S2-1]我們看到<basrfont>告訴IE全文用7號黑色Arial字體顯示,但H.SWorkshop被我們用<font>圍住了,所以執(zhí)行<font>的設定.這里有face=,size=,color=三size=(1,2,3,4,5,6,7,-size2"<basefont>size對值,被<font>圍住的文字在<basefont>2功能,這就是HTML的空標識,因為我們看到</basefont>沒有存在的意義,所以可以忽略當然如果你在<basefont>后面添加</basefont>對整個html文件也沒接下來看<STRONG><B><TT><SAMP><CODE><KBD><U><STRIKE><s><BIG><SMALL><SUB><I><EM><VAR><CITE><DFN>H.SWorkshopH.SWorkshop<strong>H.SWorkshop</strong>H.S<b>H.SWorkshop</b>H.S<tt>H.SWorkshop</tt>歡迎來到H.S<samp>H.SWorkshop</samp>H.S<code>H.SWorkshop</code>H.S<kbd>H.SWorkshop</kbd>H.S<u>H.SWorkshop</u>H.S<strike>H.SWorkshop</strike>H.S<s>H.SWorkshop</s>H.S<big>H.SWorkshop</big>H.S<small>H.SWorkshop</small>H.S<sup>H.SWorkshop</sup>H.S<sub>H.SWorkshop</sub>H.S<i>H.SWorkshop</i>H.S<em>H.SWorkshop</em>歡迎來到H.S<var>H.SWorkshop</var>H.S<cite>H.SWorkshop</cite>H.S<dfn>H.SWorkshop</dfn>H.S<address>H.SWorkshop</address>H.S現(xiàn)在比較講知 ,呵呵~我們就先來看看如何告訴別人這是你 好了HTML我們可以把他看做一個空行標識,既在網(wǎng)頁中顯示一段空白行,一般在DW或者FG等網(wǎng)頁編輯工具中,回車即在HTML插入一個<P>,這也是一個空標記,他的align="#"(#=right,left,H.S<p>H.S<palign="center">H.S<palign="right">H.S空行,后者則表示不換行,對于一些必須在一行中顯示的文字,對等align=""BR這時候我們就要通過一個另一個標識來實現(xiàn)對齊效果 </div>,當然<DIValign="center">H.S<br>H.SWorkshop<br>H.SWorkshopH.SWorkshopH.SWorkshopH.SWorkshopH.SWorkshopH.SWorkshop<nobr>H.SWorkshop</nobr><DIValign="right">H.S<br>H.SWorkshop這樣一來我們就可以實現(xiàn)對<br>align=""的三個值提出來,發(fā)現(xiàn)他們其實自身也是標識,它們可以HTMLHTML編輯的一模一樣的格式,區(qū)別就在<pre><listing>xmp>則在<pre>htmlPleaseuseyourcard.VISAMaster<b>Hereisanorder<li>AirPleaseuseyourcard.VISAMaster<b>Hereisanorder<li>AirPleaseuseyourcard.VISAMaster<b>Hereisanorder<li>Air<HRalign=""size=""width=""color=""noshade>。設定線條置放位置,可選擇:left;right;center設定線條長度,可以是絕對值(以像素作單位)100%。<imgsrc=""width=height=hspace=vspace=border=align=""alt=""首先須向HTML中導入一張 ,這張的格式可以是jpg,gif或者 的html在同一個文件夾下,我們就可以只寫文件名即可,如則需要完整的途徑1。設定圖象邊緣的空白數(shù),hspace,vspacealign=(top,middle,bottom,left,right)默認值為同樣在顯示src所顯示的之前先顯示出一張條件也是在src還沒有被而失去瀏覽的表格在網(wǎng)頁排版中所占 不用說相信大家也都知道它把整個頁面清晰的標識的作用就好象<html>告訴瀏覽器開始處理HTML文件一樣,它告訴瀏覽器現(xiàn)<tablewidth=""border=""cellspacing=""cellpadding=""align=""valign=""background=""bgcolor=""bordercolor=""bordercolorlight=""bordercolordark=""cols=""rules=""frame="">border=<tablewidth="70"<tablewidth="70"border="1"5-1]align=""(left,right,這個 面我們已經(jīng)重復的介紹過了這里是對表格的位置進行水平位置設定valign=""(top,middle,bottom)導入表格的背景設定表格的邊框顏色。(border=05-2]現(xiàn)在我們就來看看<tr><tralign=""valign=""bgcolor=""bordercolor=""bordercolorlight=""align=""(left,right,center)valign=""(top,middle,<tdwidth=""height=""colspan=""rowspan=""align=""valign=""bgcolor=""bordercolor=""bordercolorlight=""bordercolordark=""<tablewidth="350"border="1"cellspacing="0"cellpadding="2"

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論