如何在CSS中单独定位此HTML代码？

I have two sets of text that need to be inline with each other but at the moment one is placed higher than the other. The two sets of text share the same CSS code so when I edit it, both are affected. However, I would like to target only one of the text; Is there a way of doing this?

我有两组文本需要彼此内联,但目前一个文本放在另一个上面。这两组文本共享相同的CSS代码,因此当我编辑它时,两者都会受到影响。但是,我想只针对其中一个文本;有办法做到这一点吗?

Here is the HTML and CSS:

这是HTML和CSS:

<div id="mi-slider" class="mi-slider">
<?

$result = $mysqli->query("SELECT * FROM stock");
while($obj = $result->fetch_object())
{
    if($obj->id&1)
    echo "<ul>";

?>
<li class="<?=$obj->orientation=='landscape'?'landscape':'portrait'?>" id="list">
    <a href="#"><img src="./img/<?=$obj->description=='unframed'?$obj->poster_no:$obj->poster_no.'_frame'?>.jpg" alt=""></a>
    <h4><?= $obj->description=="unframed"?"Unframed Poster - 750mm x 500mm":"Framed Poster - 790mm x 540mm"?><br />&pound;<?=$obj->price?> each</h4>
</li>

The CSS code:

CSS代码:

.mi-slider ul li h4 {
display: inline-block;
font-family: HelveticaNeueRegular;
font-weight: 100;
font-size: 12px;
color: #a34235;
padding: 0 0 0;
text-align: left;
margin-top: 20px;
margin-left: 10px;
float: left;
}

3 个解决方案

#1

If you want to target the second list items H4, you can use the nth-child selector, as below:

如果要定位第二个列表项H4,可以使用第n个子选择器,如下所示:

.mi-slider ul li:nth-child(2) h4
{ your css }

3 个解决方案

#1

更多相关文章

随机推荐