html標簽中的屬性,要怎么記住html和css中那么多的標簽和屬性?
能夠記住是最好的,記不住,至少要記個開頭,然后看見能認識。
編輯就用Dreamweaver,自動提示的,你只要敲個開頭的字母,就可以選擇了。十分的方便。
當然,如果非專業的,不記住也沒關系,Dreamweaver可以設置樣式,然后自動生成代碼。但是專業的一定要知道手工寫碼,這樣,編輯樣式表速度才會快。我個人認為,想增加自己的網站開發速度,編輯源碼的能力是必備的,畢竟,打字還是比鼠標點來點去快得多。
網頁按鈕設計?
Web頁面可用預定義模板來創建,也可不采用模板而在空白頁上自己進行設計。創建新頁面的步驟如下:
在網頁視圖下,選擇“文件”菜單中的“新建”命令,再從其子菜單中選擇“網頁”命令,將彈出“新建”對話框,若用戶要新建的網頁是框架,則從“框架網頁”選項卡中選擇某種框架樣式;否則,從“常規”選項卡中選擇一種所需樣式,然后單擊“確定”按鈕。若想建立一空白網頁,可在對話框的“常規”選項卡中選擇NormalPage項,或直接單擊常用工具欄的“新建網頁”按鈕。
建議逐一試用FrontPage提供的各種模板以便熟悉它們,日后你就可以自如地利用模板創建常規Web頁面,能夠節省許多時間。
1.在網頁中插入圖形
圖片往往比大量的文字講述更具吸引力和說服力,在web頁面中適當地添加圖片會使網頁豐富多彩,但過多地加入圖片將降低頁面的下載速度,特別是對通過調制解調器訪問web頁的用戶。大多數圖形都是采用壓縮格式,有的調制解調器不具有壓縮功能,這種調制解調器速度更慢。因此用戶在加入圖片時,應認真選擇和進行規劃。雖然圖形可使web頁更有趣味,但應適度使用(使用較少顏色,縮小高度和寬度或裁剪圖形、降低圖形的分辨率,盡可能地減少圖形文件大小,如用壓縮格式的文件類型)。
Web頁面所使用的兩種圖片格式分別為GIF和JPEG,用戶可選擇“插入”菜單中的“圖片”命令,再從其子菜單中選擇“來自文件”命令,打開“圖片”對話框,“圖片”對話框提供了“掃描”、“使用您的web例覽器來選擇網頁或文件”、“剪貼畫”和“在您的計算機上選擇一個文件”四種途徑插入圖片。
對于一些非GIF和JPEC格式的圖片,FrontPage可以自動地將這些文件轉換成GIF或JPEG格式。
2.在網頁中插入水平線
水平線可以在網頁上清晰地劃分界限,而且對用戶網頁的布局起著重要的作用。添加一條水平線,可以通過“插入”菜單中選擇“水平線”命令添加。在默認狀態下水平線是灰色的,用戶可以像改變文本顏色一樣改變水平線的顏色。改變水平線的顏色有兩種方法(必須在不加主題的情況下):
(1)雙擊該水平線,將顯示“水平線屬性”對話框。在對話框的“顏色”項,選擇下拉列表,從中選擇合適的顏色,單擊“確定”按鈕。
(2)用鼠標右鍵單擊這條水平線,從快捷菜單中選擇“水平線屬性”命令,再從對話框中選擇一個合適的顏色。
使用框架
--------------------------------------------------------------------------------
框架是把Web瀏覽器的視窗分成幾個部分,每個部分都是獨立的Web頁面,這樣便可同時顯示多個頁面。
可以很容易地用FrontPage創建一個多框架的web頁面。為了創建具有框架的Web頁面,可從“文件”菜單的“新建”子菜單中選擇“網頁”命令,彈出“新建”對話框,選擇“框架網頁”選項卡。
在左邊的列表中可選擇不同類型的框架模板,選定模板后,按“確定”按鈕即可創建一個具有框架的網頁。
在創建有框架的Web頁面時,應注意有些web瀏覽器不支持框架。雖然使用不能顯示框架的瀏覽器的用戶已很少,為確保這些用戶仍然能夠瀏覽到Web站點上的內容,可以填上要告訴那些低版本瀏覽器的使用者的話,例如請對方更換瀏覽器等。
在新建的框架的窗口中,單擊“設置初始頁”按鈕將會彈出“創建超鏈接”對話框,可以鏈接到一個指定頁面;單擊“新建網頁”按鈕將創建一個新頁面,然后在該頁面內對該頁進行編輯。在編輯頁面時,若感覺頁面被放在一個狹窄的框架中太擁擠,可選擇“框架”菜單中的“在新窗口中打開網頁”命令,這樣便打開一個新的滿屏窗口,可以自由地在頁面中增加內容。
利用FrontPage的框架頁面模板在Web頁面上引入了框架布局,我們還可以在此基礎上,根據需要進行進一步的設計。
1、增加新框架
要給框架頁面增加新框架,就是像拆分表格的單元格一樣,把一個框架分為兩個框架。其操作如下:
(1)按住Ctrl鍵,將鼠標放在框架邊框上,當鼠標變為上下箭頭時,可把邊框拖到一個新位置,當松開鼠標按鈕時,一個新的空白內容的框架就形成了。
(2)也可以通過命令來操作:首先單擊要拆分的框架內部,選“框架”菜單中的“拆分框架”命令,在彈出的“拆分框架”對話框中單擊“拆分成列”或“拆分成行”單選按鈕,單擊“確定”按鈕即可。
2.刪除框架
若框架頁面看起來太亂,可刪除某些框架。要刪除一個框架,可先單擊該框架選擇它,再選擇“框架”菜單中的“刪除框架”命令即可。
3.改變框架屬性
在設置好框架的整體布局后,我們還可以對每一框架的具體屬性進行設置,操作如下:
(1)單擊需設置屬性的框架,選擇“框架”菜單中的“框架屬性”,則彈出“框架屬性”對活框。
(2)在對話框的“名稱”文本框中可輸入框架名,這樣便于識別不同的框架;在“選項”區域中,若選中“在例覽器中可以調大小”復選框,則客戶在瀏覽站點時,可重新定義框架尺寸,通過在“顯示滾動條”下拉列表框中選擇不同的描述項,可設置讓滾動條是否出現。
(3)在“框架大小”區域中,可設置框架大小,可以定義一個絕對像素值或相對于瀏覽器窗口的百分比,若要用瀏覽器來設置相對于該頁面中框架的尺寸,可選“相對”;在“邊距”區域中,可設置內容頁面與框架邊框分隔的像素數值。
(4)要改變開始頁面,可以在“初始網頁”文本框中輸入一個新的頁面名字或URL。
(5)單擊“框架網頁”按鈕,則彈出“網頁屬性”對話框。
(6)在該對話框的“框架”選項卡中,在“框架間距”文本框中,可輸入以像素為單位的邊框寬度;若要使框架邊框消失,則不要選中“顯示邊框”復選框。
(7)單擊“確定”按鈕,關閉“網頁屬性”對話框,再單擊“確定”按鈕,關閉“框架屬件”對話框,完成框架屬性設置。
動態網頁
--------------------------------------------------------------------------------
DHTML是動態網頁的意思,它其實并不是一個標準的術語。事實上沒有一種技術叫作DHTML。DHTML是利用CSS(層疊樣式表),JavaScript,HTML等技術而建立的能與訪問者產生互動的網頁。比如在動態網頁里,當訪問者單擊了某一張圖片后,這張圖片會自動的移動,這就是DHTML效果。也就是說,當網頁下載完畢后,它無需再與服務器連接就能產生變化了。FrontPage2000提供了一套容易制作動態網頁的方法,你可以建立起屬于自己特色的動態網頁。
1、使用DHTML的基本步驟
1).在頁面點選需要使用DHTML的對象,比如文本,圖片。對于文本需要拖曳鼠標選定;
2).在DHTML工具欄,選擇通過開啟的下拉列表選擇一種事件,文本和圖片所具有的事件是不同的;接下來再應用下拉列表選擇一種效果;最后選擇該效果的的實現方法;
3).當你為對象使用了DHTML后,保存該頁面并預覽,你會發現你選定的對象按照你設置的DHTML的效果出現;
4).如果想刪除某一個對象的DHTML效果,先選定該對象,然后單擊DHTML工具欄上的刪除效果圖標即可。
2、DHTML的事件
在DHTML制作中,我們聽得最多的是“事件”這個術語。什么是“事件”呢,顧名思義,就是發生的一件事情,比如你用手打開門,那么這就是一個事件。換到網頁制作中,開門變成了單擊,也就是說,訪問者單擊了一個鏈接,那么出現了事件的結果,門被打開了。
在FrontPage2000中,當我們打開DHTML效果工具欄后,點選文本或者圖片會產生不同事件。但它們的施用方法是一樣的,下面我們以文本舉例:
我們先在編輯器里輸入一段文本,比如:網頁陶吧,然后繼續下面的三個步驟:
選定一段需要產生DHTML效果的文本,這里是:網頁陶吧。從DHTML效果工具欄的開啟下拉列表選擇一個事件。這里對于文本我們只有“網頁加載”這個事件。“網頁加載”就是當網頁第一次裝入的時侯發生的事件,它不需要用戶利用鼠標去觸發它,而只需要訪問者利用瀏覽器打開它的時侯就會產生預設的動態效果。
選擇好事件后,我們要在應用下拉列表里選擇一個該事件的應用效果。在該列表下有七種可以采用的效果,我們選擇飛入。
對于應用效果會有不同的方法產生。比如當你選擇的應用效果是“飛入”的時侯,文本可以從底部飛入,可以從左邊飛入,也可以從右邊飛入,這些就是方法。在這個下拉列表里并沒有注明這個術語。有的應用效果是沒有方法的,比如波動。我們這里選擇從底部飛入。
最后保存該頁面并預覽,你會發現網頁陶吧這個四個字在網頁第一次加載后從底部飛入。當然,你也可以嘗試其它DHTML效果。對于選定圖片,你會在DHTML效果工具欄的開啟下拉列表看到新的事件,單擊和鼠標懸停,它們會有各自的應用效果和實現方法。你可以每一個嘗試一下,這樣你就能明白這些事件和應用效果和方法之間的關系。
3、DHTML的小技巧
DHTML兼容性
利用FrontPage2000制作的DHTML網頁只能被InternetExplorer4.0或以上版本完全正常瀏覽。對于圖片的DHTML效果,NetscapeCommunicator4.0或以上版本也可以瀏覽。
禁止DHTML
如果想禁用DHTML效果,點選菜單工具/網頁選項,在打開的對話框里選擇兼容性標簽,取消動態HTML前的復選框里勾,這樣DHTM效果被禁用。
快速使用DHTML
一般情況,在你沒有選定某一個對象的情況下,你只需要把鼠標移動到對象的左邊或者右邊單擊一下就可以使用DHTML效果了。
4、網頁過渡
網頁過渡是指當你進入或者離開一個網頁的時侯所產生的效果的這個過程。比如你從某一頁進入另一頁,你會發現當前頁慢慢向中間合攏,同時出現了另一個新的頁面,直到當前頁合攏消失而最后出現新的頁面。如果你想使用網頁過渡,可以按照以下步驟:
1).打開想使用過渡效果的頁面,或者新建立一個頁面。點選菜單格式/網頁過渡,打開網頁過渡對話框;
2).在事件下拉列表里選擇一個事件,我們選擇進入網頁。大家要注意,當你為某頁和站點都設置了過渡效果時,網頁將比站點過渡效果優先;
3).在周期文本框里輸入持續的時間,然后在過渡效果列表框里點選一個效果,單擊確定。利用瀏覽器打開該頁面,因為我們選擇的網頁過渡是進入網頁,所以當你打開該頁時你就能看到過渡效果了。
利用DHTML效果的確是吸引訪問者的有力利器,但如果你不愿意和復雜的代碼打交道,那么FrontPage2000為你預設了許多DHTML的效果。你要做的僅僅是選定需要動態效果的對象,比如文字,圖片,然后利用“傻瓜”式的操作就可以讓你的網頁動起來。
Web頁有自己的一組屬性,通過選擇“文件”菜單中的“屬性”或通過鼠標右鍵單擊頁內任何位置,選擇快捷菜單中的“網頁屬性”命令,可以打開“網頁屬性”對話框,在“常規”選項卡中,各項設置含義如下:
·位置:指出頁的完整URL。
·標題:顯示的頁標題,即在HIML中顯示在元素中的標簽內。
·基位置:在此位置可輸入一個URL,可將這頁中使用的相對URL的超鏈接總指向同一正確的目標,通過對一個URL的說明,可以在不移動相對URL中所有目標的情況下,移動這個頁。
·默認的目標框架:定義不規定框架的頁中所有超鏈接的默認框架。
·背景音樂:加入背景音樂,當瀏覽器打開該頁時,會同時播放音樂。
在其它選項卡中還可對頁邊距、語言等系統參數進行設置。
建立超鏈接
--------------------------------------------------------------------------------
超鏈接(HyperLink)的出現使網上瀏覽變得更加便捷,只須用鼠標輕輕點擊,便能輕松地從一個頁面跳轉到另一個頁面,從一個Web站點跳到另一個Web站點,從一個國家跳到另一個國家。超鏈接就是一些特殊的文本或圖像,是其它頁面的入口。
1.與當前web站點的頁面建立超鏈接
(1)在FrontPage中打開要建立超鏈接的頁面(若是新建頁面,則要肯定該頁面己被保存),選中超鏈接源,超鏈接源可以是一個字符、一個單詞、一句話或一幅圖片等。
(2)選擇“插入”菜單中的“超鏈接”命令,或單擊“常用”工具欄的“超鏈接”按鈕,則彈出“創建超鏈接”對話框(如圖),在該對話框中列出了當前FrontPage中打開的Web站點中的文件夾和文件。
(3)在該對話框的文件列表中,選擇要建立鏈接的目標文件。
(4)單擊“確定”按鈕,超鏈接建成。
2.與本機中的其它文件建立超鍵接
(1)選擇超鏈接源,打開“創建超鏈接”對話框。
(2)在該對話框中單擊“制作一個鏈接到您計算機上文件的超鏈接”按鈕,然后從彈出的對話框中找到自己所要鏈接的文件,選中它。
(3)單擊“確定”按鈕,超鏈接建成。
3.與worldwideweb上某一站點建立超鏈接
(1)在FrontPage中打開欲建超鏈接的頁面,選定超鏈接源。
(2)選“插入”菜單中的“超鏈接”或單擊常用工具欄的“超鏈接”按鈕,彈出“創建超鏈接”對話框。
(3)在“URL”文本框中,輸入超鏈接目標的URL。
(4)單擊“確定”按鈕。
格式化文本
--------------------------------------------------------------------------------
1.輸入文本
從總體而言,文本仍是網頁中的主體內容,在FrontPage中輸入文本與在Word中輸入文本非常類似。
(1).需要加入空行或換段時才使用Enter鍵,當輸入文本達到所定義的右邊界時,將自動換行。若錄入文字有錯可按Backspace鍵清除錯誤,重新錄入。
(2).可在文本中任意位置處插入新文本內容,操作時把鼠標指針定位到欲加文本處即可添加文本。
(3).可進行覆蓋式錄入,即先用鼠標選中要替換的文本,然后直接錄入文本。
(4).可通過單擊常用工具欄的“顯示所有”按鈕,讓段落標記在屏幕上顯示或隱藏,借助段落標記可清楚地看到段與段之間的空行。
2.文本的選擇
(1).選擇一個單詞或多個單詞:選擇一個單詞只需在該單詞上雙擊鼠標即可,按住鼠標左鍵在要選單詞上拖動即可選擇多個單詞。選擇字與選擇多個單詞的方法相同。
(2).選擇一行文字:一行文字就是在屏幕上占據一行空間的文本。將鼠標箭頭移到行的最左邊,當光標箭頭變為指向左邊時,單擊鼠標左鍵,便可選擇該行。
(3).選擇一個段落:將鼠標箭頭移到該段落的最左邊,當光標箭頭變為指向左邊時,雙擊鼠標左鍵,或按下ALT鍵,再用鼠標單擊想要選擇的段落,即可選擇該段落。
3.刪除、拷貝和移動文本或圖片
(1).刪除:刪除插入點左側的一個字符,按Backspace鍵;刪除插入點右側的一個字符,按Delete鍵;刪除插入點右側的一個單詞,按Ctrl+De1ete鍵;剪切所選內容并保行到“剪貼板”,按Ctrl+X鍵;刪除所選內容按De1e1e鍵或選擇“編輯”菜單中的“刪除”命令。
(2).拷貝:拷貝所選文本或圖形到剪貼板,方法是:選中文本或圖形,然后按Ctrl+C鍵或從菜單上選擇“編輯”菜單中的“復制”菜單命令,也可直接單擊工具欄中的“復制”按鈕。
(3).移動文本或圖片:選擇想要移動的文本或圖片,再拖曳到要插入的位置,釋放鼠標,所選對象就移到目的地。如果先將選擇的文本或圖片“剪切”,然后再“粘貼”到指定區域,也可將其移動。
(4).通過“撤銷”取消誤操作:如果用戶在不小心的情況下錯誤地執行操作,單擊工具欄上的“撤銷”命令按鈕,可以取消用戶執行過的操作,或從菜單欄選擇“編輯”菜單中的“撤銷”菜單命令,或按Cir1+Z鍵。
4.加入標題
出于頁面內容層次的需要,有時在頁面中要加入一些小標題。HTML語言規范采用6級標題,各級標題采用文字不同字號來區分,其中標題1為大標題,其它依次為中小標題。要設定某一級標題,可以在FrontPage格式工具欄中的“樣式”下拉列表中選中一個標題等級,然后在光標處輸入標題文字即可;或者先輸入文字,并選定該文字,然后在“樣式”下拉列表中選定某一級標題。標題結束后,將下拉列表中的格式改回原來的“普通”,再進行其它內容的輸入。
5.改變字體及設置字體效果
FrontPage在通常情況下,字體為“TimesNewRoman”。若用戶的操作系統是中文Windows95/98或WindowsNT,中文默認字體為“宋體”,文字大小采用默認的字號。若要設定不同的字體,可先選擇要改變的文字,然后在格式工具欄里的“字體”下拉菜單中選擇一種字體,或從菜單欄選擇“格式”菜單中的“字體”菜單命令,通過“字體”對話框來設置,并可設定字體樣式、大小等。當字體改變后,形式將一直保持,直到用戶又重新設置新的字體為止。
(1).設置字體顏色:選中文字,單擊格式工具欄上的“文本顏色”按鈕的下拉箭頭,就會彈出其下拉列表,在“標準顏色”中選擇所需顏色;若沒有,可選擇“更多的顏色”命令,然后從彈出的對話框中選擇。
(2).設置字體樣式:要對需要的文字進行粗體、斜體和下劃線處理,只要選擇要處理的文字,從格式工具欄上單擊“加粗”、“斜體”或“下劃線”按鈕即可。想解除此效果,可以選中文字,再次按相應的按鈕就可以解除效果,恢復到正常字體。在制作網頁時,一般不采用“下劃線”效果,因為下劃線在一些網頁中都表示有超鏈接。
(3).字體加線效果:共有兩種:“下劃線”可以在選中的文字下面劃一條線;“刪除線”在文字中間貫穿劃一條線。
(4).特殊的文字風格:當選中的文字需要使用某些特殊風格,如“閃爍”風格,可通過選擇“字體”對話框中“字體”選項卡(如圖)的“效果”區域的所需選項,但有的文字特殊效果只有在瀏覽器中才能體現出來。
6.文本的縮進
文本的縮進就是使文本左邊、右邊顯示空白,這種效果有利于對關鍵段落加強說明。要對一個已有的段落運用縮進的方式,首先選中段落,然后在格式工具欄上單擊“增加縮進”按鈕,段落左邊和右邊分別縮進一段距離,連續按“增加縮進”按鈕,縮進將進一步加大。這種在文字兩邊同時縮進的方式也稱之為雙向縮進。若縮進的空間太大,可以通過單擊“減少縮進”按鈕來減少縮進的空間。
7.文本對齊方式
若輸入的文字是從該頁的左邊距開始,并逐漸向右延伸,且到了行滿以后又折回下行左邊(左邊距處)重新開始,這就是左對齊。有些文字需要居中方式,比如標題之類的文字;而有些文字需要放到右邊,這些可通過格式工具欄上的“向左對齊”、“居中”和“向右對齊”按鈕來實現:,不同的對齊方式可以使文本呈現不同的顯示樣式,而且可以清楚地表明用戶想要說明的問題,使網頁整體保持協調。要設定文本的居中、左齊或右齊方式,須先選擇好要設置的文本,再單擊相應按鈕即可。如果用戶想回到原始狀態的對齊的方式,應先選定該文本,再單擊格式工具欄上相應的對齊按鈕。
8、加入項目符號或列表編號
有一些列表前面有加圓點的符號,說明一條條的列表內容,這在專業排版中稱為項目符號,在Web頁面中加入項目符號或列表編號可使內容有條理、更清楚,可以通過列表把大量內容簡要地描述出來,便于讀者抓住重點。還有另外一種形式即列表編號,可以用來描述一個問題的處理步驟和順序,這兩種處理形式在FrontPage中運用起來很方便。
加入項目符號或列表編號與在Word中的操作很類似。先選定文本,用戶可以在格式工具欄按相應的按鈕,或選“格式”菜單中的“項目符號和編號方式”命令,打開項目符號和編號方式對話框(如圖),從中選定不同格式的列表項目。
在FrontPage中新建的兩個文本行之間都有一個空行,如果用戶在輸入或添加項目時不想每兩行之間都出現一個空行,可以在格式工具欄上單擊“項目符號”或“編號方式”按鈕。該按鈕為下凹狀后同時出現第一個項目符號,輸入需要的文字后,按“回車”鍵,然后在自動出現的下一個項目符號后繼續輸入。
FrontPage還可以通過提供列表編號或項目符號的方式對列表項進行排列。操作方法與上一段所述相同。
如果在所有項目輸入完畢后,以下的內容不再希望添加編號或項目符號,可兩次回車,則停止編號或停止添加項目符號。若想改變編號的形式或不想從1開始,可通過在列表符號上單擊鼠標右鍵,在彈出的快捷菜單上選擇“列表屬性”命令,在彈出的“列表屬性”對話框中選擇“號碼”選項卡,選擇所需的編號風格,再在右邊的“初始號碼”微調器中調整起始編號,在調好之后單擊“確定”按鈕即可。
制作網頁是一個非常復雜的過程,你不僅需要懂得美工,還需要多少知道點程序,還有網上的:
網頁制作和簡單程序教程!
html中邊框屬性用什么標簽?
使用border屬性。
CSS border 屬性允許您指定元素邊框的樣式、寬度和顏色。CSS 邊框樣式border-style 屬性指定要顯示的邊框類型。
允許以下值:
dotted - 定義點線邊框
dashed - 定義虛線邊框
solid - 定義實線邊框
double - 定義雙邊框
groove - 定義 3D 坡口邊框。效果取決于 border-color 值
ridge - 定義 3D 脊線邊框。效果取決于 border-color 值
inset - 定義 3D inset 邊框。效果取決于 border-color 值
outset - 定義 3D outset 邊框。效果取決于 border-color 值
none - 定義無邊框
hidden - 定義隱藏邊框
border-style 屬性可以設置一到四個值(用于上邊框、右邊框、下邊框和左邊框)。