实例
<!DOCTYPE html>
<html>
<head>
<title>文本控制</title>
<meta charset="utf-8">
<style type="text/css">
p{font-weight:bold; /*定义粗体*/
font-size: 40px; /*定义字体大小*/
font-family:楷体; /*定义字体*/
text-align: right;
;
}
h1{text-align: center; /* left right*/
height: 40px;
background: pink;
line-height: 40px;} /* 定义行高
*/
span{font-size:40px;font-weight: bold;font-family:Georgia;}
img{width: 300px;height: 400px;}
b{display: block;width: 300px;
height: 40px;
background: pink;
overflow: hidden; /*超出我定义的宽高就不现实了*/
}
b:hover{overflow: visible;} /*显示出来刚才全部的内容*/
</style>
</head>
<body>
<p>PHP</p>
<h1>中文网</h1>
<br>
<br>
<span style="color:#498DFF">G</span>
<span style="color:rgb(255,62,49)">o</span>
<span style="color:#FFEFA7">o</span>
<span style="color:#92BAED">g</span>
<span style="color:#33AA50">l</span>
<span style="color:#F64C4D">e</span>
<br>
<!-- 图文混合 如下 -->
<p style="display: inline-block;width: 300px;height: 400px;">7月中旬，防汛抢险救灾工作作出重要指示：“相关地区党委和政府要牢固树立以人民为中心的思想，最大程度降低灾害损失。”</p>
<img src="http://t.cn/RDuW9Zh">
<br>
<br>
<br>
<img src="http://t.cn/RDuW9Zh">
<b>7月中旬，防汛抢险救灾工作作出重要指示：“相关地区党委和政府要牢固树立以人民为中心的思想，最大程度降低灾害损失。</b>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
