特征布局4

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf8"/>
<title></title>
<style type="text/css">
*{margin: 0;
padding: 0;}
.outer{
width: 960px;
height: 269px;
background-color: azure;
border: 1px solid #a1a1a1;
margin: 100px auto 0;
}
.box{width: 920px;
height: 219px;
border-top: 1px solid #a1a1a1;
margin: 0 auto;
}
p{margin-left: 20px;
font: bold 18px "微軟雅黑";
color:#000;
padding: 12.5px;
}
.pic1{padding: 20px 12.5px 0px 0px;}
.pic2{padding: 20px 12.5px 0px 12.5px;}
.pic3{padding: 20px 0px 0px 12.5px;}
.pic4{padding: 25px 12.5px 38px 0px;}
.pic5{padding: 25px 12.5px 38px 12.5px;}
.pic6{padding: 25px 0px 38px 12.5px;}
</style>
</head>
<body>
<div class="outer">
<p>圖片展示</p>
<div class="box">
<img class = "pic1" src="goods.jpg" alt="圖片">
<img class = "pic2" src="goods.jpg" alt="圖片">
<img class = "pic2" src="goods.jpg" alt="圖片">
<img class = "pic2" src="goods.jpg" alt="圖片">
<img class = "pic3" src="goods.jpg" alt="圖片">
<img class = "pic4" src="goods.jpg" alt="圖片">
<img class = "pic5" src="goods.jpg" alt="圖片">
<img class = "pic5" src="goods.jpg" alt="圖片">
<img class = "pic5" src="goods.jpg" alt="圖片">
<img class ="pic6" src="goods.jpg" alt="圖片">
</div>
</div>
</body>
</html>

特征布局4.html.png

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 不會(huì)用代碼框,所以看著有些亂套,,,,html部分 <!DOCTYPE html> 迅雷看看 ...
    這就是個(gè)帥氣的名字閱讀 1,560評(píng)論 0 0
  • 1. tab列表折疊效果 html: 能源系統(tǒng)事業(yè)部 崗位名稱: 工作地點(diǎn) 崗位名...
    lilyping閱讀 1,891評(píng)論 0 1
  • 1、垂直對(duì)齊 如果你用CSS,則你會(huì)有困惑:我該怎么垂直對(duì)齊容器中的元素?現(xiàn)在,利用CSS3的Transform,...
    kiddings閱讀 3,195評(píng)論 0 11
  • 各種純css圖標(biāo) CSS3可以實(shí)現(xiàn)很多漂亮的圖形,我收集了32種圖形,在下面列出。直接用CSS3畫出這些圖形,要比...
    劍殘閱讀 9,656評(píng)論 0 8
  • 老公最近很忙,應(yīng)酬也多,手頭的活也很多,又要組織會(huì)議,每天固定去給一個(gè)老病號(hào)換藥…… 我不忙,但也沒給自己輕松……...
    薛小禪閱讀 94評(píng)論 0 0