CSS盒子嵌套和文字内容居中

最新推荐文章于 2022-11-15 00:00:23 发布

L菌体

最新推荐文章于 2022-11-15 00:00:23 发布

阅读量1k

点赞数 1

分类专栏： CSS

本文链接：https://blog.csdn.net/weixin_46507557/article/details/113027993

版权

CSS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			#outer{
				width:300px;
				height:200px;
				background-color: #008000;
				margin:auto;/*外边距盒子居中*/
				padding:50px;/*内边距-->使中间盒子居中*/
				margin-top: 100px;/*外上边距*/
			}
			#inner{
				width:200px;
				height:200px;
				background-color: #FA8072;
				margin: auto;
				text-align: center;/*文本水平居中*/
				/*vertical-align: middle;设置元素的垂直对齐方式。*/
				line-height:200px;/*文本垂直居中*/
				
			}
		</style>
	</head>
	<body>
		<div id="outer">
			<div id="inner">我在这</div>
		</div>
	</body>
</html>

在这里插入图片描述

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

L菌体

关注关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
CSS盒子嵌套和文字内容居中

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> #outer{ width:300px; height:200px; background-color: #008000; margin:auto;/*外边距盒子居中*/ padding:50px;/*内边距--&
复制链接

扫一扫