製作一個簡單的文章列表頁面樣式
阿新 • • 發佈：2019-01-08
仿製了一個簡單的文章列表頁面樣式
<!doctype html> <html> <head> <meta charset="utf-8"> <style> *{ margin:0; padding:0; font-family:宋體; } div{ width:50%; height:250px; border:1px solid rgb(202,205,158); margin:50px auto; } p{ font-size:1em; font-weight:bold; background:rgb(202,205,158); padding:0.2em; } ul{ list-style-type:none; font-size:0.8em; } li{ padding:0.7em; padding-left:1.75em; border-bottom:1px dashed black; background:url(download.jpg) no-repeat; background-size:2em 2em; background-position:0 0.1em; } li>span{ diaplay:inlie-block; float:right; width:12em; } </style> </head> <body> <div> <p>>>日誌</p> <ul> <li>簡報IMAX加長版《變形金剛》（Transformers）親歷<span>2017-09-25</span></li> <li>《變形金剛》發燒友的看圖說話（多圖）<span>2017-09-22 10:13 </span></li> <li>《反恐王國》（The Tingdom）：生猛的空心彈<span>2017-09-22 08:03</span></li> <li>《東方承諾》（Eastem Primises）：不動如山，暗流洶湧<span>2017-09-20 11:07</span></li> <li>《妖精的旋律》（Elfen Lied）：日式YY的經典案例<span>2017-09-20 10:44</span></li> </ul> </div> </body> </html>
問題：
1、內容在縮放後，排版會被嚴重破壞，應該嘗試做成響應式設計網頁。
2、background的定位規則還是不太清楚。