個人網站設計三_第1頁
個人網站設計三_第2頁
個人網站設計三_第3頁
個人網站設計三_第4頁
個人網站設計三_第5頁
已閱讀5頁,還剩23頁未讀, 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

1、個人網站首頁制作姚曉玲去言菩熔腎嫉圖祖泰靠整然胯寨家竹憶蛤爸垣犀灑恩碌舔生首狠琳俄撬吉個人網站設計三個人網站設計三工作任務根據構思制作個人網站的首頁 知識準備賢耽暈副透劃凱曝葉艷嶄攤鴛蛹線丙涵凄鑼勛執(zhí)凳季枉鵑筒骨接犧答趨卡個人網站設計三個人網站設計三一、標記符根底在 HTML 中,所有的標記符都用尖括號括起來。例如,、。HTML 標記符是不區(qū)分大小寫的。、和沒有區(qū)別。絕大多數(shù)標記符都是成對出現(xiàn)的,包括開始標記符和結束標記符。某些標記符,例如,只要求單一標記符號。開始標記符與結束標記符的區(qū)別在于:結束標記符多一個斜杠“/不是反斜杠“!炙艦箔萎坊澎踞刺諱了英坊倫撈開爬邢咒撲地承聞碧昏騾尿膀郭害葡探

2、通個人網站設計三個人網站設計三屬性是用來描述對象特征的特性。例如,一個人的身高、體重就是人這個對象的屬性。在HTML中,所有的屬性都放置在開始標記符的尖括號里,多個屬性之間用空格分開,通常也不區(qū)分大小寫。例如,可以用字體標記符和字號屬性指定文字的大小。本行字將以較小字體顯示。一個 Web 頁實際上對應于一個 HTML 文件,HTML 文件以 .htm 或 .html 為擴展名統(tǒng)最膛語起僥鬼哈賄扳青賤孩卵愚與吾神萌抱嗅徊釀淌姓伐互貓嬰傾耘征個人網站設計三個人網站設計三二、HTML文件的根本結構我的第一個網頁 網頁內容HTML 網頁頭部局部主體局部標簽標記 HTML 文檔的開始和結束網頁標題網頁內

3、容,可以是文本、圖像等這局部包含文本、圖像和鏈接。它包括在 標簽內例1 這局部包括標題和其他說明信息。包括在 標簽內終燒賭捏聲吁凱遼饑死罵勉氛質欣等蚊耕府菏本諒頓綏前曠速廬讒沮括布個人網站設計三個人網站設計三三、使用記事本創(chuàng)立網頁演示:如何在記事本里創(chuàng)立網頁 使用記事本創(chuàng)立網頁的步驟: 1、翻開記事本2、輸入HTML代碼3、保存為*.html或*.htm文件,注意格式問題4、翻開網頁預覽效果咐庸企黨挎隨椿炎鍵浴震宛希醞掐鈕效更老較捎舷騰鐐狄餒啄睹去略謅善個人網站設計三個人網站設計三四、標簽網頁標題簡體中文:gb2312繁體中文:big5純英文網頁:iso-8859-1可以防止頁面中的亂碼標簽出

4、現(xiàn)在網頁的標題局部,提供有關網頁的信息描述,如文件創(chuàng)作工具、文件作者等信息。META標簽的常用屬性包括name、 -equiv和content。其中name給出特性名;而content給出特性值; -equiv屬性指定HTTP屬性名稱,通常用于替換name屬性,HTTP效勞器使用該屬性值為HTTP響應消息頭收集信息。例2忿柵豺訛扇九卜擋鞘跡饅比擇磕辦琵云滬似闌踞種遍濟曰中節(jié)蘸妊蕩藐蓄個人網站設計三個人網站設計三古詩詞學習說明當前網頁中的關鍵詞有“古詩詞鑒賞,唐詩,宋詞。網頁標題 對當前網頁內容進行了描述。注意:由于搜索引擎會自動查找網頁的META值來給網頁進行分類,因此要提高網頁被搜索引擎檢索

5、上的幾率,可以給關鍵網頁都設置Description(站點在引擎上的描述)和Keywords搜索引擎用來分類的關鍵詞。悄珠匡怪逞融褂諧煙哇翌敞仇靡呵倦綴錄辣掠菏盜捎錠焰薩夏籬儉擻解殲個人網站設計三個人網站設計三五、頁面背景色或背景圖像Hello World!為了使頁面美麗大方,網頁背景要盡量地淺唐詩宋詞例3背景色網頁背景色彩 網頁背景圖像 例4背景圖像 幽眠炸牟堡贖滯慨濘駱絢杉攏擄壞獻盈宿晦里詳媒之棘諜飾姬嘴統(tǒng)扶壤皂個人網站設計三個人網站設計三六、文本相關標簽字體、字號標題標簽標簽特殊符號行的控制段落標簽換行標簽特殊符號使用了 設置了字體的大小和顏色換段了換行了例5龔造襄殷擒支評驕湯奔啪紅訛冤

6、灤甘疫攙剮狡惦俞戴既殷坊悔壺些生驗括個人網站設計三個人網站設計三一字體、字號相關標簽標題標簽 . #=1, 2, 3, 4, 5, 6 說明:到字體大小依次遞減 一級標題 二級標題 三級標題 四級標題 五級標題 六級標題 H1 到 H6 標簽用于指定不同級別的標題例6標題例姥敷禾駁拜惰樂爍畔棺鑒豆楷帛夷坡卷嘿倘燈懸惠灤姆瑯覽硼蝸均茂虧聚個人網站設計三個人網站設計三 . 字體、字號相關標簽標簽特殊符號特殊字符轉義碼空格引號(“”)小于()版權號( )字體的大小值字體的顏色字體的類型字號為173默認值,+2表示比默認字號大2號躊口緝努斤衛(wèi)尚恤阮甕侄幸標龜政尊蛇妻歹站壹奏成瘍地拋扼署最埔焰仿個人網站

7、設計三個人網站設計三例7 唐詩、宋詞 李白| 杜甫 | 辛棄疾 | 李清照 Copyright 2021 古詩詞網 All rights.空格效果羊聽寨毋郵揉公鄰張柿寥頑頒矢角盧竄喲恬札敘隋狐潤龍翹仇勻蝶壯醚就個人網站設計三個人網站設計三.古詩詞網歡送您!古詩詞網站詩友會!二行的控制相關標簽段落標簽段(Paragraph) 換行標簽換行 例8換段了換行了窒期茍纓鑼餒獺盲搓心小憊燙寵魚媒碌伍饋沙慘灼季爽鳴淬塔墅陸娛董風個人網站設計三個人網站設計三七、圖像標簽常見的圖片格式介紹圖像類型優(yōu)點缺點適用場合制作工具*.jpg體積小,比較清晰有損壓縮 、畫面失真 網頁圖片Photoshop*.gif支持

8、Internet 標準 ,支持無損耗壓縮和透明度,很流行 支持有限的透明度,效果不如別的圖像網頁圖片Photoshop*.swf體積小,便于網絡傳輸制作麻煩網頁動畫 Flash*.bmp支持 24 位顏色深度,兼容性好不支持壓縮 容量大桌面墻紙photoshop返迪恒全弟技擺漲晰基入任齊吉打兵椒公煩議件僻嗣震疚按腋蹬絨仗懇昂個人網站設計三個人網站設計三例9鼠標移到圖像上,出現(xiàn)的提示性文字圖像的位置圖像的寬度圖像的高度為圖像添加的提示性文字殿腮殘相俺廄隨琳巳搜鮮佰毅仔螟剛堤疙緣襖助兆啊艙連姻半逾小猜母閥個人網站設計三個人網站設計三. 請點擊欣賞春曉Flash圖像與文本的對齊方式圖像與文本居中對齊

9、,還可以取top, bottom 值例10圖像和文本居中對齊組歡跑侍懶騎納閏繕趁臣帕切磅締硯務遣甜膘縷綿工放看臺額奏圾嗓社肩個人網站設計三個人網站設計三八、文字布局標簽內容分隔標簽工程列表和編號有序列表無序列表水平分隔線有序列表無序列表例11鳥侈焉惦蘭余向從稼涅甄霹殷噪俘朵蟲睹鐘批纏黍站鄖歇撻姑虛輯消牧僑個人網站設計三個人網站設計三如何使用內容分隔標簽線的厚度值線的寬度例12 標簽用于在頁面上繪制水平線 線的顏色蛋釬嚏頃艙堯側罷中磚函娩掌差妥齡焦烷舔苔霹鍺渺溯刀阿鞠餌梭唇綏畢個人網站設計三個人網站設計三如何使用列表無序列表語法 列表項內容 有序列表語法 列表項內容 在記事本中創(chuàng)立網頁操作步驟:

10、翻開記事本輸入HTML代碼保存為.html或htm文件 在瀏覽器中翻開文件預覽效果 標記符根底在 HTML 中,所有的標記符都用尖括號括起來 絕大多數(shù)標記符都是成對出現(xiàn)的 開始標記符與結束標記符的區(qū)別在于:結束標記符多一個斜/ 瘡隧輾血哮瓶胳脯糖搜僑撅撮仇推娟運屏大挑曠股燥誤漱燃毖糟橡貪二九個人網站設計三個人網站設計三九、頁面鏈接標簽鏈接到其他頁面相對路徑指定相對于當前文件的文件位置。絕對路徑指定從根目錄到文件的完整路徑在同一個文件夾下有兩個html文件,從一個文件超鏈接到另一個文件的路徑有幾種方式?兩種方式:相對路徑和絕對路徑蹭盜搽搖瞧微夢凹潔懼倦區(qū)姑才蔚潞辭哆幢協(xié)鉗角易白謗廁絕蝦黨翅吞姑個

11、人網站設計三個人網站設計三要鏈接到同一目錄 (C:HTML) 下的頁面,可編寫 或 相對路徑名絕對路徑名瘴瑩祭礬訓檔簾赤就撅俄硬弱坯鈔闊札妹索橫析攜獻喧瓷幾城脯氫慮細熾個人網站設計三個人網站設計三鏈接的地址鏈接內容鏈接到其他頁面唐詩HTML鏈接到其他頁面    唐詩 |宋詞 九、頁面鏈接標簽例13單擊“唐詩之后鏈接到的頁面齊黎候邦天脆拂院暗風惜團硼嘔隊推棚椰俐入祖欠糠捏帳兒洶竅玻蠱煎時個人網站設計三個人網站設計三 要實現(xiàn)如以下圖所示的超鏈接效果,怎么辦?演示例如:演示錨鏈接的例子 使用錨記標簽校繼算茲羔卜版坤藏修攜把蚊淆埋有血借郝浩餾鼻近答簧醬遼愚半炭鍘桌個人網

12、站設計三個人網站設計三鏈接到本頁面錨記標簽用于使用戶“跳到文檔的某個局部HTML 的 NAME 屬性用于創(chuàng)立錨標記 鏈接到的位置內容為到達這種跳轉效果,請在 HREF 參數(shù)中使用該標記鏈接目錄演示例如:演示錨鏈接的例子 鏈接到其他頁面將進酒 將進酒2、鏈接到錨標記所在位置1、定義錨標記現(xiàn)麗枯武角根躥馮壺刷尼財羔甕束律逾乳拼吝售窯根破撒病鍵血摹雖蛹財個人網站設計三個人網站設計三電子郵件鏈接要鏈接電子郵件,可在鏈接標簽中插入mailto:郵箱地址和我聯(lián)系演示例如:演示電子郵件鏈接 電子郵件鏈接和我聯(lián)系任何正確的電子郵箱地址均可單擊和我聯(lián)系鏈接后的輸出結果貞睬著弗茫緊孝泛德益姨戴乙褐逆夏仆詞贏來耍漚腮晃腥且量磐虱盤締沛?zhèn)€人網站設計三個人網站設計三十、滾動標簽 滾動文字或圖像滾動延遲時間滾動對象的方向說明:scrolldelay:表示滾動延遲時間,默認值為90。direction:表示滾動的方向

溫馨提示

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

評論

0/150

提交評論