-
網頁制作中 結構、表現、行為分離，其中 HTML 是結構,CSS是樣式，JS是行為查看全部
-
結構與表現的分離： text-indent：使文本縮進到想要的位置。 只是一行簡短文字數字，可以用段落排版的思路來“定位”，即用text-indent：**px 縮進來達到目的。 如果設置一個極小的負值，則可以在瀏覽器上隱藏文本，卻又能被搜索引擎搜索到查看全部
-
網頁制作中 結構、表現、行為分離，其中 HTML 是結構,CSS是樣式，JS是行為查看全部
-
再復雜的網頁，都是由小模塊組成的查看全部
-
1.Html:先關注內容及模塊的關系，重點編寫html語義化，不要考慮樣式。 2.布局：使用margin或浮動、定位來布局對象的位置 3.樣式：最后是樣式來裝飾html標簽查看全部
-
text-indent文本縮進，只能是固定寬度才適應，如果是自適應寬度，是不行的。查看全部
-
先按結構和語義編寫代碼 然后進行CSS樣式設置 精簡HTML <div class="demo03"> <img class="userPic" src="images/head01.jpg" width="50" height="50" /> <h5>櫻桃小丸子</h5> <p>奧鵬教育是由教育部高等教育司2001年12月批準立項試點，2005年4月正式批準運營的遠程教育公共服務體系，為遍布全國的學員提供學歷(專升本，高起專)和非學歷教育咨詢、報名、學習輔導、課程考試、交費等7X24小時學習支持服務400-810-6736。</p> <span class="pubTime">10分鐘前</span> </div> .demo03 { width: 460px; padding: 20px; position: relative; background-color: #EEF7FF; border: 1px solid #CCC; margin-left: 100px } .demo03 h5 { margin-bottom: 5px } .demo03 p { text-indent: 2em; line-height: 20px } .demo03 .userPic { float: left; margin: -20px 0 0 -100px } .demo03 .pubTime { position: absolute; top: 10px; right: 20px; color: #999; }查看全部
-
使用text-indent文本縮進查看全部
-
text-indent 文本縮進查看全部
-
用直接的思路查看全部
-
先按結構和語義編寫代碼 然后進行CSS樣式設置 減少HTML與CSS契合度查看全部
-
高級思路查看全部
-
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>編程挑戰-圖片背景</title> <style type="text/css"> body{ margin:0;} div{background:#460E29;width:700px;padding:20px} img{padding:1px 25px 37px 25px;margin-right:10px;background:url(http://img1.sycdn.imooc.com//5385ac820001905201440133.jpg);} </style> </head> <!-- 存在img標簽，并且img標簽設置了底圖，底圖為自動鋪滿 通過分析得知：img標簽本身src的圖片尺寸小于底圖的圖片尺寸，這就導致底圖被img本身的圖片壓住了，而圖片是沒透明度的 所以底圖無法顯示。底圖是帶邊框花紋的，邊框內部大小跟img圖片大小相同，所以我們對img標簽設置padding屬性，給img內部4個方向填充一個邊框花紋的距離，這樣底圖的邊框花紋就能顯示出來。我們要知道，填充區域是空白的距離。 盒子模型五個層次的上下關系，從上到下依次為border content&padding background-image background-color margin 由于沒有為content設置內邊距，所以content覆蓋了盒子內部，當設置了padding之后，就露出了部分被遮擋的內容 --> <body> <div><img src="http://img1.sycdn.imooc.com//5385acb000013b0d00950095.jpg" /> <img src="http://img1.sycdn.imooc.com//5385acb000013b0d00950095.jpg" /> <img src="http://img1.sycdn.imooc.com//5385acb000013b0d00950095.jpg" /> <img src="http://img1.sycdn.imooc.com//5385acb000013b0d00950095.jpg" /> </div> </body> </html>查看全部
-
網頁換膚: 相同的html結構，不同的css樣式。查看全部
-
先考慮設計圖中的文字內容和內容模塊之間的關系，重點放在編寫html結構和語義化，然后考慮布局和表現形式。查看全部
舉報
0/150
提交
取消