我的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/

10-12 00:49
查看更多