欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Dreamweaver怎么使用clear清除浮動?

百度經(jīng)驗(yàn)   發(fā)布時(shí)間：2018-06-05 15:18:59   作者：患者無薪   我要評論
Dreamweaver怎么使用clear清除浮動？Dreamweaver中想要清除清除浮動命令，該怎么使用呢？下面我們就來詳細(xì)介紹clear清除浮動的使用方法，需要的朋友可以參考下

今天我們就來看看Dreamweaver中清除浮動clear的用法，浮動效果只會對后面的有影響，所以清除浮動命令要添加在后者身上，具體該怎么使用呢？下面我們就來看看詳細(xì)的教程。

1、打開Dreamweaver新建html文檔，在body中輸入內(nèi)容

<div>01</div>
<div>02</div>
<div>03</div>
<div>04</div>

2、對添加的div添加屬性值，如圖所示，添加不同的顏色作為背景

div:nth-child(1){background-color:red;}
div:nth-child(2){background-color:green;}
div:nth-child(3){background-color:blue;}
div:nth-child(4){background-color:gray;}

3、對第一個(gè)div添加浮動效果float:left；

4、在瀏覽器中預(yù)覽查看效果如圖所示，可以看到只對第一個(gè)div添加了浮動效果，而下方的第二個(gè)div也受到了影響，

5、所以為了避免第二個(gè)也受到影響，對其添加清除浮動，因?yàn)榈谝粋€(gè)是添加了向左浮動left，所以如果清除第二個(gè)的浮動效果，可以添加清除向左浮動clear:left;

6、如果不清楚該添加向哪個(gè)方向的清除屬性，可以設(shè)置為clear:both;不管向左還是向右一律清除，如圖所示效果也是相同的。

7、對第三個(gè)div添加向右的浮動，如果所示float:right;

8、對第三個(gè)div浮動，會影響到第四個(gè)div，所以對第四個(gè)div添加清除浮動。

以上就是Dreamweaver中clear清除浮動的使用方法，希望大家喜歡，請繼續(xù)關(guān)注腳本之家。

相關(guān)推薦：

DW怎么設(shè)置網(wǎng)站的背景圖像?

dreamweaver怎么做一個(gè)簡單的網(wǎng)頁?

dreamweaver中怎么將文字放到圖片上?

相關(guān)文章

  • Dreamweaver網(wǎng)頁怎么創(chuàng)建css樣式的復(fù)合聲明?

    Dreamweaver網(wǎng)頁怎么創(chuàng)建css樣式的復(fù)合聲明？Dreamweaver中想要制作一個(gè)css樣式的復(fù)合聲明，該怎么制作呢？下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下
    2018-01-02

  • Dreamweaver網(wǎng)頁中怎么插入導(dǎo)航條? dw網(wǎng)頁導(dǎo)航條的使用方法

    Dreamweaver網(wǎng)頁中怎么插入導(dǎo)航條？Dreamweaver中網(wǎng)頁為了更有層次感，想要插入導(dǎo)航條，該怎么使用導(dǎo)航條呢？下面我們就來看看dw網(wǎng)頁導(dǎo)航條的使用方法，需要的朋友可以參考
    2018-01-02

  • Dreamweaver怎么避免中文亂碼的問題?

    Dreamweaver怎么避免中文亂碼的問題？Dreamweaver設(shè)計(jì)網(wǎng)站的時(shí)候，會遇到中文亂碼的情況，該怎么提前預(yù)防出現(xiàn)這種情況呢？請看下文詳細(xì)的介紹，需要的朋友可以參考下
    2017-12-31

  • Dreamweaver cc2018新版頁面怎么切換回舊版本布局?

    Dreamweaver cc2018新版頁面怎么切換回舊版本布局？Dreamweaver cc2018中的布局界面和舊版本有很大不同，很多工具都找不到，想要切換到舊版本，該怎么切花呢？請看下文詳細(xì)
    2017-12-20

  • Dreamweaver怎么添加本地的瀏覽器為測試瀏覽器?

    Dreamweaver怎么添加本地的瀏覽器為測試瀏覽器？Dreamweaver測試瀏覽器可以自己添加，該怎么將電腦安裝的火狐瀏覽器添加到測試瀏覽器呢？下面我們就來看看詳細(xì)的教程，需要
    2017-12-19

  • dreamweaver網(wǎng)頁中怎么制作DIV圖層?

    dreamweaver網(wǎng)頁中怎么制作DIV圖層？dreamweaver制作網(wǎng)頁的時(shí)候，想要在網(wǎng)頁上制作一個(gè)圖層放圖片，該怎么制作呢？下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下
    2017-12-19

  • Dreamweaver怎么使用標(biāo)簽及代碼設(shè)計(jì)表格?

    Dreamweaver怎么使用標(biāo)簽及代碼設(shè)計(jì)表格？Dreamweaver中可以直接繪制表格，也可以通過標(biāo)簽和代碼來制作表格，下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下
    2017-12-12

  • Dreamweaver怎么使用框架結(jié)構(gòu)快速制作網(wǎng)頁?

    Dreamweaver怎么使用框架結(jié)構(gòu)快速制作網(wǎng)頁？Dreamweaver制作網(wǎng)頁的時(shí)候，表格布局已經(jīng)不能實(shí)現(xiàn)網(wǎng)頁的功能了，比如同一頁面下有多個(gè)子頁面時(shí)，就要使用框架結(jié)構(gòu)來布局，下面
    2017-12-11

  • dreamweaver怎么制作鼠標(biāo)經(jīng)過圖片變換的效果?

    dreamweaver怎么制作鼠標(biāo)經(jīng)過圖片變換的效果？dreamweaver中想要制鼠標(biāo)經(jīng)過或點(diǎn)擊圖片，圖片會改變，該怎么制作這個(gè)效果呢？下面我們就來看看詳細(xì)的教程，需要的朋友可以參
    2017-12-11

  • dreamweaver怎么快速對齊代碼? dw對齊代碼的設(shè)置方法

    dreamweaver怎么快速對齊代碼？dreamweaver中的代碼很多，想要對齊代碼，該怎么對齊呢？下面我們就來看看dw對齊代碼的設(shè)置方法，需要的朋友可以參考下
    2017-12-11

最新評論