30-CSS-11-CSS(CSS的布局-图文混排)



【CSS的布局-图文混排】


步骤1:先将图片、文字等数据进行标签的封装;【切记】凡是需要操作的文字都要标签封装,如带有超链接效果的文字


步骤2:根据标签设置样式;


【示例代码】


<html>
<head>
<style type="text/css">
	#imgtext{
		border:#06F dashed 1px;
		height:400px;
		width:200px;
	}


	#img{
		height:20px;
		width:16px;
	}


	#text{
		float:bottom;	/*漂浮*/
		color:#F60;
		font-family:"华文隶书";	/*修改字体*/
	}
</style>
</head>


<body>
	<div id="imgtext">		
		<div id="img"><img src="1.jpg" /></div>
	
		<div id="text">
		这是一个美女,哇!这是一个美女,哇!这是一个美女,哇!
		</div>
	</div>
</body>
</html>


你可能感兴趣的:(30-CSS-11-CSS(CSS的布局-图文混排))