方便又快速插入網(wǎng)頁標(biāo)簽的方法
制作網(wǎng)頁時,要在網(wǎng)上插入一段javascript代碼或者是在某一段文字上加入css代碼,您通常都是怎么做的呢?綠色資源網(wǎng)的小編通常采用手寫的方式,但是這種方法是很浪費時間的。也有人說,通過dreamweaver的可視試圖,點查找再插入,但是這種方法需要查找,不太方便!那么有沒有更快速更方便的方法呢?今天就和新客網(wǎng)的小編一起來學(xué)習(xí)方便又快速的添加、編輯網(wǎng)頁標(biāo)簽的方法吧!
下面我們以Dreamweaver 8為例,假設(shè)大家Dreamweaver面板布局都為默認的布局方式。查看一下屬性面板的上方是否有一行小標(biāo)簽。(如果您用的不是MX,標(biāo)簽在狀態(tài)欄中)例如:你新建一個空白的HTML文檔,上面的小標(biāo)簽應(yīng)該為<body>。請看下圖:
圖上畫紅框的地方,就是我們今天的主角了。我們先看一下“環(huán)繞標(biāo)簽”。在頁面上隨便打入幾個字,選中它們,在右鍵菜單中選擇“環(huán)繞標(biāo)簽”,在彈出的環(huán)繞標(biāo)簽對話框中輸入“<strong>”(不包括引號),然后回車。之前被選中的文字是不是已經(jīng)變成粗體了,到源代碼看一下,我們所選中的文字是不是已經(jīng)被<strong>標(biāo)簽包圍了?大家可以試著再加入其它的一些標(biāo)簽,如:<a>,<p>。這里也可以直接輸入屬性。如:<p style="color:#CC0000">。這里僅大概說明一下,如有疑問,請查看Dreamweaver的幫助。
下面說一下標(biāo)簽選擇器的應(yīng)用方法。
我們將光標(biāo)移動到剛才加粗的文字里,會發(fā)現(xiàn)在<body>的后面多了個<strong>。這就是說光標(biāo)所在處的這些文字的外面有<strong>的標(biāo)簽,在<strong>標(biāo)簽外有<body>標(biāo)簽。下面大家再添加一個表格,把光標(biāo)移動到表格內(nèi),看看標(biāo)簽的結(jié)構(gòu)。相信對HTML有些基礎(chǔ)的朋友都應(yīng)該很容易理解的。
假設(shè)我們現(xiàn)在要插入一個表格,并將這個表格用CSS來將它下移10個象素。先插入一個表格,然后交光標(biāo)移動到表格內(nèi)。這時在標(biāo)簽選擇器上應(yīng)該可以看到這樣的字樣<body><table><tr><td>。然后在table標(biāo)簽上點鼠標(biāo)右鍵,會看到有四個選項。刪除標(biāo)簽、編輯標(biāo)簽、設(shè)置類、設(shè)置ID。
刪除標(biāo)簽:即是將標(biāo)簽刪除。(有一些特殊的標(biāo)簽是不能刪除的。例如:<table>、<tr>、<td>、<body>...)
編輯標(biāo)簽:給標(biāo)簽附加屬性、修改屬性等。
設(shè)置類:給這個標(biāo)簽附予一個類。(即CSS的類別)
設(shè)置ID:給這個標(biāo)簽附予一個ID。(即CSS的ID)
在這里,我們選擇編輯標(biāo)簽,然后在后面加上屬性style="margin-top:10px"和正常書寫源代碼的方式是一樣的。然后按下回車。就完成了編輯。如果在Dreamweaver里看不到效果,請用瀏覽器預(yù)覽。
還有另外一種方法,也許你會喜歡。選擇窗口→標(biāo)簽檢查器當(dāng)你選擇某一個標(biāo)簽后,這里會顯示出當(dāng)前選擇標(biāo)簽的所有屬性。也可以很快地在這里進行編輯。在這里輸入的屬性不用包括引號,編輯后按回車確定。
這里我們只將方法告訴大家,希望大家能夠從中受益。
關(guān)鍵詞:Dreamweaver,網(wǎng)頁標(biāo)簽
閱讀本文后您有什么感想? 已有 人給出評價!
- 1
- 2
- 2
- 1
- 101
- 28