在進(jìn)行網(wǎng)站建設(shè)時(shí)如果添加文本元素呢?今天圭谷設(shè)計(jì)來(lái)為大家詳細(xì)分解文本元素的步驟:
文本是傳遞信息的基礎(chǔ),瀏覽網(wǎng)頁(yè)內(nèi)容時(shí),大部分時(shí)間是瀏覽網(wǎng)頁(yè)中的文本,所以學(xué)會(huì)在網(wǎng)頁(yè)中創(chuàng)建文本至關(guān)重要。在Dreamweaver CS6中可以很方便地創(chuàng)建出所需的文本,還可以對(duì)創(chuàng)建的文本進(jìn)行段落格式的排版。
一、課堂案例——在網(wǎng)頁(yè)中添加文本
文本是基本的信息載體,是網(wǎng)頁(yè)中最基本的元素,在瀏覽網(wǎng)頁(yè)時(shí),獲取信息最
直接、最直觀的方法就是通過(guò)文本。下面通過(guò)實(shí)例講述如何在網(wǎng)頁(yè)中添加文本。
最終實(shí)例效果文件所在的位置:最終文件\CH01\1.5.1\index1.htm。
1 打開(kāi)“原始文件\CH01\1.5.1\index.htm”
2 將光標(biāo)放置在要輸入文本的位置,輸入文本。
二、設(shè)置文本字體類型
輸入文本后,可以在【屬性】面板中對(duì)文本的大小、字體和顏色等進(jìn)行設(shè)置。設(shè)置文本屬性的具體操作步驟如下。
1 在【屬性】面板中【CSS】選項(xiàng)卡的【字體】下拉列表中選擇【編輯字體列表】選項(xiàng)。
2 在彈出的【編輯字體列表】對(duì)話框中的【可用字體】列表框中選擇要添加的字體,單擊[圖片]按鈕添加到左側(cè)的【選擇的字體】列表框中。此時(shí),在【屬性】面板的【字體】列表框中就會(huì)顯示新添加的字體。重復(fù)以上操作即可添加多種字體。若要取消已添加的字體,可以在【編輯字體列表】對(duì)話框的【字體列表】列表框中選中該字體組合,相應(yīng)的多個(gè)字體會(huì)出現(xiàn)在【選擇的字體】列表框中,然后選中要取消的字體,單擊按鈕即可。
3 完成字體樣式的編輯后,單擊【確定】按鈕確認(rèn)修改并關(guān)閉該對(duì)話框。完成一個(gè)字體樣式的編輯后,可進(jìn)行下一個(gè)樣式的編輯。若要?jiǎng)h除某個(gè)已經(jīng)編輯的字體樣式,可在【編輯字體列表】對(duì)話框的【字體列表】列表框中選中該樣式單擊[圖片]按鈕。
4 這里在【屬性】面板中選擇【字體】為“宋體”,彈出【新建CSS規(guī)則】對(duì)話框,在對(duì)話框的【選擇器類型】中選擇“類(可應(yīng)用于任何HTML元素)”,在【選擇器名稱】中輸入名稱“.ziti”,在【規(guī)則定義】中選擇“僅限該文檔”
。
三、設(shè)置文本大小
選擇一種合適的字體,是決定網(wǎng)頁(yè)美觀、布局合理的關(guān)鍵,在設(shè)置網(wǎng)頁(yè)時(shí)應(yīng)對(duì)文本設(shè)置相應(yīng)的字號(hào)。
1 選中要設(shè)置字號(hào)的文本,在【屬性】面板中的【大小】下拉列表中選擇字號(hào)的大小,或者直接在【大小】文本框中輸入相應(yīng)大小的字號(hào)。
2 此時(shí)彈出【新建 CSS 規(guī)則】對(duì)話框,設(shè)置相應(yīng)選項(xiàng)后單擊【確定】按鈕,即可完成文本大小的位置。
四、設(shè)置文本顏色
設(shè)置文本顏色的具體操作步驟如下。
1 選中設(shè)置顏色的文本,在【屬性】面板中單擊【文本顏色】按鈕,打開(kāi)調(diào)色板。
2 在調(diào)色板中選中所需的顏色,光標(biāo)變?yōu)閇圖片]形狀,單擊鼠標(biāo)左鍵即可選取該顏色,此時(shí)彈出【新建CCS規(guī)則】對(duì)話框,設(shè)置完成后單擊【確定】按鈕,即可設(shè)置文本顏色。
【提示】
如果調(diào)色板中的顏色不能滿足需要時(shí),單擊按鈕,彈出【顏色】對(duì)話框,在對(duì)話框中選擇需要的顏色即可。
五、設(shè)置文本段落
文檔中,也可以設(shè)置文本的段落格式,以使網(wǎng)頁(yè)中的文本更加美觀和易讀。其段落的概念與在編排Word文檔中的段落概念相同,當(dāng)然對(duì)段落的設(shè)置也大同小異。
選中要設(shè)置標(biāo)題段落的文本,選擇【窗口】|【屬性】命令,打開(kāi)【屬性】面板,在【格式】下拉列表中選擇所需的段落格式
在【格式】下拉列表中可以設(shè)置以下段落格式。
【段落】:選擇該項(xiàng),則將插入點(diǎn)所在的文字塊定義為普通段落,其兩端分別被添加<p>和</p>標(biāo)記。
【預(yù)先格式化的】:選擇該項(xiàng),則將插入點(diǎn)所在的段落設(shè)置為格式化文本。其兩端分別被添加<pre>和</pre>標(biāo)記。這時(shí)候在文字中間的所有空格和回車等格式全部被保留。
【無(wú)】:選擇該項(xiàng),則取消對(duì)段落的指定。
【標(biāo)題】:常常用來(lái)強(qiáng)調(diào)段落要表現(xiàn)的內(nèi)容,在HTML中共定義了6級(jí)標(biāo)題,從1級(jí)到6級(jí),每級(jí)標(biāo)題的字體大小依次遞減。
Copyright All Rights GreatGoal Design co.,ltd. 魯ICP備16002128號(hào)-3