30-CSS-12-CSS(CSS的布局-图像签名)

最新推荐文章于 2023-11-23 15:12:44 发布

wy_0928

最新推荐文章于 2023-11-23 15:12:44 发布

阅读量483

点赞数

分类专栏： No.5-JavaWeb自学笔记（三）——CSS

本文链接：https://blog.csdn.net/wy_0928/article/details/47616591

版权

No.5-JavaWeb自学笔记（三）——CSS 专栏收录该内容

11 篇文章

订阅专栏

本文通过一个具体的实例展示了如何使用HTML和CSS进行页面布局。详细介绍了如何设置字体样式、图片位置以及元素的绝对定位等技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<html>
<head>
	<style type="text/css">
		#text{
			font-family:"华文隶书";
			font-size:24px;
			position:absolute;	/*先飘起来，再定位*/
			top:50px;	/*其有父节点，所以这里是相距父节点的距离*/
			left:10px;
		}

		#imgtext{
			border:#F60 dotted 1px;
			width:160px;
			position:absolute;	/*这里定位是为了让text盒子中内容跟着其父对象走，详见之前视频*/
			top:50px;
			left:50px;
		}
	</style>
</head>

<body>
	<div id="imgtext">
	<div id="img">
	<img src="1.jpg" />
	</div>

	<div id="text">
	我的美女！
	</div>
	</div>
</body>
</html>