<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文本控制</title>
<style type="text/css">
p{font-weight:bold;/*定义粗体*/
font-size: 30px;/*定义字体大小*/
font-family: 楷体;/*定义字体*/
}
h1{text-align: center; /*left right*/
height: 100px;
background: blueviolet; /*背景色还不知道？？？*/
line-height: 100px;/*定义行高*/
}
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; margin-bottom: 100px;}
b:hover{ overflow: visible;}/*默认值 内容不会缩减 元素会被呈现在元素框外*/
</style>
</head>
<body>
<h1>php中文网</h1>
<p>php中文网</p>
<br>
<!--谷歌logo-->
<span style=color:#0388F1>G</span>
<span style="color:rgb(245,28,39)">o</span>
<span style="color: #ffe80e">o</span>
<span style=color:#0388F1>g</span>
<span style="color: #39ff18">l</span>
<span style="color: #ffe80e">e</span>
<!--图文gun
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文本控制</title>
<style type="text/css">
p{font-weight:bold;/*定义粗体*/
font-size: 30px;/*定义字体大小*/
font-family: 楷体;/*定义字体*/
}
h1{text-align: center; /*left right*/
height: 100px;
background: blueviolet; /*背景色还不知道？？？*/
line-height: 100px;/*定义行高*/
}
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; margin-bottom: 100px;}
b:hover{ overflow: visible;}/*默认值 内容不会缩减 元素会被呈现在元素框外*/
</style>
</head>
<body>
<h1>php中文网</h1>
<p>php中文网</p>
<br>
<!--谷歌logo-->
<span style=color:#0388F1>G</span>
<span style="color:rgb(245,28,39)">o</span>
<span style="color: #ffe80e">o</span>
<span style=color:#0388F1>g</span>
<span style="color: #39ff18">l</span>
<span style="color: #ffe80e">e</span>
<!--图文gun排-->
<br>
<p style="display: inline-block;width: 300px;height: 400px;">字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容</p>
<img src="images/1.gif">
<br>
<br>
<img src="images/1.gif">
<b>字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容</b>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
排-->
<br>
<p style="display: inline-block;width: 300px;height: 400px;">字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容</p>
<img src="images/1.gif">
<br>
<br>
<img src="images/1.gif">
<b>字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容字体内容</b>
</body>
</html>
