html - 我怎样才能把列表文本放在中间?

标签 html css text text-styling

==这里我需要把我的文字放在球的中间。

这是我的输出,但我需要中间的这些文本 enter image description here

.items {
	padding-top: 50px;
	
}
.items ul {
	list-style: none;
}
.items ul li {
	width: 200px;
	height: 200px;
	background: white;
	border-radius: 200px;
	float: left;
	margin-left: 150px;
	margin-bottom: 50px;
	text-align: center;
}
<div class="items">
  <ul class="items">
    <li>Printed-T-Shirts</li>
    <li>Get Your Print</li>
    <li>Choose A Design</li>
    <li>Full-T-Shirts</li>
    <li>1-Color-Designs</li>
    <li>MultiColor Designs</li>
  </ul>
</div>

最佳答案

.items {
	padding-top: 50px;
	
}
.items ul {
	list-style: none;
}
.items ul li {
	width: 200px;
	height: 200px;
	background: #ccc;
	border-radius: 200px;
	display: inline-block;
	margin-left: 150px;
	margin-bottom: 50px;
  position: relative;
}

.items ul li p {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  margin: 0;
  width: 100%;
  text-align: center;
}
<div class="items">
			<ul class="items">
				<li><p>Printed-T-Shirts</p></li>
				<li><p>Get Your Print</p></li>
				<li><p>Choose A Design</p></li>
				<li><p>Full-T-Shirts</p></li>
				<li><p>1-Color-Designs</p></li>
				<li><p>MultiColor Designs</p></li>
			</ul>
		</div>

关于html - 我怎样才能把列表文本放在中间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49550478/

相关文章:

javascript倒数计时器变为负数

javascript - 空 ul 的 li 计数

javascript - js脚本在段落中插入文字时logo移动

c++ - 在 C++ 程序中包含大量文本文件

html - HTML 中的控件属性不允许对视频进行控件

html - 如何使 Font Awesome 图标按钮处于禁用状态?

CSS 在不同浏览器中对齐元素符号点

html+css,在没有表格的ul旁边放一个按钮

text - HTML 5 Canvas 上的垂直对齐文本

html - 表格单元格中的内容未对齐