HTML
<pre>
<head>
<title>
title of the page
</title>
<link rel="styleheet" type="text/css" href="css/style.css">
</head>
<body>
<ul>
<li>Italy</li>
<li>France</li>
<li>Greece</li>
</ul>
<h1> This is the main heading</h1>
<p>This text might be an introduction to the rest of
the page. And if the page is a long one it might
be split up into several sub-headings</p>
<h2>this is the second heading</h2>
<p> long live the King :Many long articles have sub-headings so to help
you follow the structure of what is being written.
There may even be sub-sub-headings (or lower-level
headings).</p>
<h2>Another sub heading</h2>
<p>Here you can see another sub-heading.</p>
<p>This is how we make a word appear <b>bold.</b></p>
<p>This is how we make a word appear <i>italic</i>.
</p>
<ul>
<li>Potatoes</li>
<li>Oranges</li>
<li>Berries</li>
</ul>
</body>
</html>
</pre>
CSS:
<pre>
body{background: url("../img/poza.jpg");
}
ul{text-align: left;
}
ol{
list-style-position: right;
text-align:
}
</pre>
最佳答案
使用类或 id 的
HTML
<ul class="list1">
<li>Italy</li>
<li>France</li>
<li>Greece</li>
</ul>
<ul class="list2">
<li>Potatoes</li>
<li>Oranges</li>
<li>Berries</li>
</ul>
CSS
.list1 {
text-align: left;
color: red;
}
.list2 {
text-align: right;
color: blue;
}
此外，如果你想将 CSS 应用于所有内部的“li”，例如“ul class="list1"'(以避免为每个“li”元素赋予类)，你可以在 css 中使用子/父元素来实现:
.list1 > li {
color: orange;
}
关于html - 我有 2 个不同的列表，我想在 css 上设置样式，我应该怎么做？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41861887/