<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
#wrap{width: 900px;height: 520px;margin: auto;border-color: red;border-width: 2px;border-style: solid;margin-top: 5px;}
div{text-align: center;}
#pic{width: 420px;height: 300px;background-image: url(./img/ex9%20(1).jpg);background-repeat: no-repeat;background-position: center center;float: left;background-color: #77A;}
#text{background-image: url(ex9%20(1).jpg);float: right;width: 420px;height: 500px;background-color: #77A;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;border-width: 2px;letter-spacing: 0.5em;line-height: 1.5em;text-align: center;}
</style>
</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>何事秋風悲畫扇。</p>
<p>等閑變卻故人心,</p>
<p>卻道故心人易變。</p>
<p>驪山雨罷清宵半,</p>
<p>淚雨霖鈴終不怨。</p>
<p>何如薄幸錦衣郎,</p>
<p>比翼連枝當日愿。</p>
</div>
</div>
</div>
</body>
</html>
uj5u.com熱心網友回復:
圖片名字改改
ex9%20(1).jpg --------> 1.jpg
uj5u.com熱心網友回復:
url(ex9%20(1).jpg) 樣式里面引入的圖片名稱不標準 改一下uj5u.com熱心網友回復:
代碼沒啥問題,應該你的url()地址沒對,另外注意一下,font-family:里的字體要加英文引號轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/65585.html
標籤:HTML(CSS)
下一篇:這個怎么把它搞成同一高度
