我在让元素符号显示在无序列表中时遇到了一些问题。如果我更改 css 以在内部显示元素符号,它们应该向上,但紧挨着文本。我的伙伴想要的是元素符号显示在框架的最左侧,并且在它和文本之间有几个标签值的空间。我把边距/边框/填充搞得一团糟。 bit 无法让子弹准确到达我想要的位置!
我在下面包含了我的 html 和 css。
谢谢! 詹姆斯
有问题的页面:
http://www.pingdynamic.com/sites/slva/services.html
CSS:
ul {
list-style-type: circle;
list-style-position: outside;
}
li {
margin-left: 50px;
}
HTML:
<h2 class="subheading">You Dream It. We Bring To Life.</h2>
<br>
<p>SLVA is proud to offer the following servies:</p>
<ul>
<li>Consultation - Let's discuss your goals and ideas and how to achieve them.</li>
<li>High performance parts, sales and installation.</li>
<li>Custom body work - From wide-body kits and ground effects to really any custom aesthetic modification you can imagine.</li>
<li>Custom carbon fiber design, forming and application.</li>
<li>Custom 3-stage paint work.</li>
<li>Full fabrication services - We work with all materials (including steel, aluminum, stainless steel) and methods
(traditional and TIG welding) </li>
<li>Custom chassis design and modification.</li>
<li>Custom suspension design, modification and fabrication.</li>
</ul>
</div>
最佳答案
你看不到元素符号的原因是因为你在 style.css 的第 10 行中有 overflow-x:hidden
- 这被应用于一大堆元素,包括 ul
和 li
。
尝试这样的事情:
<!DOCTYPE html>
<html lang="en">
<head>
<title>SVLA</title>
<style>
ul {
list-style-type: circle;
list-style-position: outside;
margin-left: 10px;
overflow: visible;
}
li {
padding-left: 50px;
overflow: visible;
}
</style>
</head>
<body>
<h2 class="subheading">You Dream It. We Bring To Life.</h2>
<br>
<p>SLVA is proud to offer the following services:</p>
<ul>
<li>Consultation - Let's discuss your goals and ideas and how to achieve them.</li>
<li>High performance parts, sales and installation.</li>
<li>Custom body work - From wide-body kits and ground effects to really any custom aesthetic modification you can imagine.</li>
</ul>
</body>
(我在此示例中向 ul
和 li
添加了一些额外的填充和边距,以补偿页面中的其他样式)
关于html - 显示外框的 UL 子弹,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16291704/