標籤:color tom text 距離 position lis 模組 相容 成就
鎮場詩:
清心感悟智慧語,不著世間名與利。學水處下納百川,舍盡貢高我慢意。
學有小成返哺根,願鑄一良心部落格。誠心於此寫經驗,願見文者得啟發。
——————————————————————————————————————————
code:
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style type="text/css"> /*first,全域css設定*/ /*去除內外邊距後,相容性好*/ html,body,h1,p{ padding:0px; margin:0px; } /*去除項目符號*/ ul,li,ol{list-style:none;} /*全域連結初始化*/ a:link,a:visited{color:blue;text-decoration:none;} a:hover{color:red;} /*網頁中的普通文字 標題的大小不變,超連結的顏色不變*/ body{font-size:12px;color:#444;background-color:#ccc;} /*second,新聞模組設定*/ .news{ border:1px solid #b200ff; width:400px; margin:40px auto;/*div在網頁中置中顯示*/ padding:20px 20px 176px;/*邊線到內容的距離*/ /*171px的內填充是用來裝載圖片的*/ /*加背景圖*/ /*背景色 背景圖 不平鋪*/ background:white url(images/bgpicture.jpg) no-repeat; /*控制背景圖的方位*/ background-position-x:152px;/*400+20+20-20-268(內容寬+左右填充和-圖片寬度-圖片到右邊的距離)*/ background-position-y:bottom; } .news .title{ padding:5px 0px 10px;/*內填充 上5 下15 左右0px*/ text-align:center; } .news p{ text-indent:25px;/*首行縮排*/ line-height:150%; padding:7px 0px;/*內填充 上下16 左右0*/ } </style></head><body> <div class="news"> <h1 class="title">九華山地藏菩薩露天銅像</h1> <!--塊元素h1,p 自動撐滿父元素--><p class="newsContent1">九華山地藏菩薩露天銅像坐落於中國四大佛教名山之一、國家級重點風景名勝區、首批5A級旅遊景區的九華山。1995年開始籌建,由頂峰國際規劃設計公司承擔景區規劃設計,聖像主體高99米,是目前世界上最高的露天地藏菩薩大銅像,是九華山國際性佛教道場的標誌性景觀。</p><p class="newsContent2">九華山地藏菩薩露天銅像,像身高度84米,加上蓮花座底盤高度99米,整個銅像連同底座高155米,是目前世界上最大最高的佛教造像之一。地藏菩薩為比丘相,右手持錫杖,左手持摩尼寶珠。面向西北方,端莊慈祥,以示“昭示眾生,國泰民安”。</p> </div></body></html>
文字介紹節選自《百度百科》
result:
——————————————————————————————————————————
博文的精髓,在技術部分,更在鎮場一詩。編輯器 VS2015,瀏覽器 Firefox。
html+css+js,強,值得努力學習。我跟著傳智播客的視頻教程學習。
我是一個新手,所以如果博文的內容有可以改進的地方,甚至有錯誤的地方,請留下評論,我一定努力改正,爭取成就一個良心部落格。
註:此文僅作為科研學習,如果我無意中侵犯了您的權益,請務必及時告知,我會做出改正。
css基礎 設定背景 背景色 背景圖片 不平鋪 背景圖片在x、y軸上的位置