我的HTML页面中有两个.row部分,我需要不同的CSS,但是对于我的CSS,它们都在.row下,并且.row中的所有方面都在它们之间展开。如何使这些.row具有单独的CSS而不丢失其中一个的.row特性?
如果这毫无意义,请告知。。。:P页
我在HTML+CSS中的问题
<style>
.row {
margin: 0 5px;
position: relative;
}
.row {
padding: 0 30px;
}
</style>
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img width="100%" src="https://image.ibb.co/gweBdQ/image.jpg" alt="Annas Blog">
<div class="caption">
<h3><font face="Calibri"><strong>The Blog!</strong></font></h3>
<p><small>View Anna's Blog! That's why you're here anyway... right?</small></p>
<p><a href="BLOG.html" class="btn btn-primary" role="button">View Blogs!</a></p>
</div>
</div>
</div>
以及单独的一排
<div class="container">
<div class="row">
<div class="col-sm-3">
<ul class="list-group">
<li class="list-group-item text-center"><label><font class="text" align="center" face="Indie Flower" size="6">See Anna's People!</font></label>
<br/>
<img style="vertical-align:middle" width="299" height="299" class="img-circle" src="https://pbs.twimg.com/profile_images/880522424705441799/EPujLjrD_400x400.jpg" />
</li>
</div>
</div>
</div>
第二行的填充会影响第一行。
不带行填充
带.行填充
你看,它小得多?
最佳答案
我不确定我是否正确理解你的问题,但我想你想要这样的东西:
.row {
font-size: 30px;
}
.divA {
color: red;
}
.divB {
color: blue;
}
<div class="row divA">
<p> I'm Div A</p>
</div>
<div class="row divB">
<p>I'm Div B</p>
</div>
它们都有
font-size:30px
但颜色不同关于html - 有.row替代吗?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44961305/