Web前端：木兰花令网页案例设计
生活随笔
收集整理的這篇文章主要介紹了
Web前端：木兰花令网页案例设计
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
案例
HTML
<!DOCTYPE html> <html><head><meta charset="utf-8"><meta name="author" content="huyiwei"><meta name="generator" content="HBuilder X"><title>css+div</title><link rel="stylesheet" href="實(shí)驗(yàn)9-1.css" type="text/css" /></head><body><div id="wrap"><div id="pic"></div><div id="text"><div id="title">木蘭花令.擬古決絕詞</div><div id="author">納蘭性德</div><div id="content"><p>人生若只如初見</p><p>何事秋風(fēng)悲畫扇</p><p>等閑變卻故人心</p><p>卻道故人人易變</p><p>驪山雨罷清宵半</p><p>淚雨霖鈴終不怨</p><p>何如薄幸錦衣郎</p><p>比翼連枝當(dāng)日愿</p></div></div></div></body> </html>CSS
#wrap{width: 900px;height: 520px;margin: 0 auto;border: 2px red solid;margin-top: 5px; } div{text-align: center; } #pic{width: 420px;height: 300px;background-image: url(圖片/9-1.jpg);background-repeat: no-repeat;background-position: center;float: left;background-color: #7777aa; } #text{background-image: url(圖片/9-1.jpg);float: right;width: 420px;height: 500px;background-color: #7777aa;padding: 10px;font-weight: bold; } #title{font-family: 華文彩云;font-size: 32px; } #author{font-size: 12px;font-family: 黑體;text-align: right;margin-bottom: 24px; } p{font-family: 隸書;font-size: 24px;margin: 2px;letter-spacing: 0.5em;line-height: 1.5em;text-align: center; }總結(jié)
以上是生活随笔為你收集整理的Web前端：木兰花令网页案例设计的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 分享苹果电脑和乔布斯的十项成功秘诀
- 下一篇： java对中文首字母拼音排序