• <noscript id="ecgc0"><kbd id="ecgc0"></kbd></noscript>
    <menu id="ecgc0"></menu>
  • <tt id="ecgc0"></tt>

    CSS怎么讓圖片居中

    html+css

    代碼編纂器:Dreamweaver CS5

    方式/步調

    1. 1

      新建一個html文件,定名為test.html,用于講解CSS怎么讓圖片居中。

      63d9f2d3572c11df91e06b5e6c2762d0f703c29e.jpg
    2. 2

      在test.html文件內,利用div標簽建立一個模塊,并設置div標簽的class屬性為content,本家兒要用于下面經由過程該class來設置css樣式。

      908fa0ec08fa513d67c4b8a3326d55fbb2fbd965.jpg
    3. 3

      在test.html文件內,在div標簽內,利用img標簽建立一張圖片,圖片為images文件夾下面的4.jpg圖片。

      0bd162d9f2d3572c26d348a18513632762d0c39e.jpg
    4. 4

      在test.html文件內,編寫標簽,頁面的css樣式將寫在該標簽內。

      58ee3d6d55fbb2fb05458c6f404a20a44623dc65.jpg
    5. 5

      在css標簽內,經由過程content類名設置div的樣式,利用width屬性設置div的寬度為400px,利用height屬性設置div的高度為300px,利用background屬性設置div的布景顏色為灰色。

      f3d3572c11dfa9ecb31f826a6dd0f703918fc19e.jpg
    6. 6

      在css標簽內,經由過程對div內的內容(圖片)利用text-align屬性來設置,將text-align設置為center,實現圖片的居中顯示。

      3c6d55fbb2fb43162a71ae072fa4462309f7d365.jpg
    7. 7

      在瀏覽器打開test.html文件,查看實現的結果。

      42166d224f4a20a40c70e8ba9f529822720ed065.jpg
    • 發表于 2019-11-27 17:08
    • 閱讀 ( 1141 )
    • 分類:其他類型

    你可能感興趣的文章

    相關問題

    0 條評論

    請先 登錄 后評論
    聯系我們:uytrv@hotmail.com 問答工具
  • <noscript id="ecgc0"><kbd id="ecgc0"></kbd></noscript>
    <menu id="ecgc0"></menu>
  • <tt id="ecgc0"></tt>
    久久久久精品国产麻豆