我在尝试为我的两个<ul>列表设置不同样式的行距时遇到了一些问题。
我如何让它们变得独一无二?如何编写css代码来告诉其中之一添加行间距?
我在w3schools网站上,但我想我有点迷路了,因为我在使用这个:
<style type=text/css">
ul li {padding:6px;}这是将填充应用于两个列表,我如何区分这两个lists>
ul列表示例1:
<ul class="a">
<li><b>Asset Question</b> - a question requested for a specific job code and posting</li>
<li><b>Common Asset Questions</b> - a question likely to used by mnay agencies, such as proficiency in Excel or Word, HR/CMS or MMARS (i.e., the existing question ACOMMON-01 - How proficient are you in Microsoft Outlook?)</li>
<li><b>Special Requirement Question</b> - typically a question about a license or certification required for the job title in general or for a specific position for that title (i.e., the existing question "SREQ-31" - Do you possess a current and valid Massachusetts Class A Motor Vehicle Operator's License?).</li>
</ul>ul列表示例2:
<ul class="b">
<li><b>Less than 1 year of experience</b></li>
<li><b>At least 1 year but less than 3 years of experience</b></li>
<li><b>At least 3 years but less than 5 years of experience</b></li>
<li><b>At least 5 years but less than 7 years of experience</b></li>
<li><b>At least 7 years but less than 10 years of experience</b></li>
<li><b>At least 10 years of experience</b></li>
<li><b>None of the above</b></li>
</ul>发布于 2017-01-28 04:12:43
下面是两个列表样式不同的示例。
只需将您的自定义类添加到css中的html元素即可。(ul.your-class)。您也可以只使用".your-class“而不指定html元素。
ul.a {
list-style-type: circle;
padding-left: 10px;
}
ul.b {
list-style-type: square;
padding-left: 20px;
}List A:<br>
<ul class="a">
<li><b>Asset Question</b> - a question requested for a specific job code and posting</li>
<li><b>Common Asset Questions</b> - a question likely to used by mnay agencies, such as proficiency in Excel or Word, HR/CMS or MMARS (i.e., the existing question ACOMMON-01 - How proficient are you in Microsoft Outlook?)</li>
<li><b>Special Requirement Question</b> - typically a question about a license or certification required for the job title in general or for a specific position for that title (i.e., the existing question "SREQ-31" - Do you possess a current and valid Massachusetts Class A Motor Vehicle Operator's License?).</li>
</ul>
<hr>
List B:
<br>
<ul class="b">
<li><b>Less than 1 year of experience</b></li>
<li><b>At least 1 year but less than 3 years of experience</b></li>
<li><b>At least 3 years but less than 5 years of experience</b></li>
<li><b>At least 5 years but less than 7 years of experience</b></li>
<li><b>At least 7 years but less than 10 years of experience</b></li>
<li><b>At least 10 years of experience</b></li>
<li><b>None of the above</b></li>
</ul>
发布于 2017-01-28 04:12:06
.a li {
padding:16px;
}
.b li {
padding:6px;
}发布于 2017-01-28 04:12:15
ul.a li {padding:7px;}...will只针对class="a“列表。
https://stackoverflow.com/questions/41902170
复制相似问题