标题混合/浮动在段落旁边

时间:2016-10-19 14:37:43

标签: html css

尝试做一个学校项目,并做几个标题,使文本在段落之后突出,但第二个标题继续与标题1下的第一段相混合

<h1>Nvidia</h1>
    <p>For more than two decades, NVIDIA has pioneered visual computing, the art and science of computer graphics.
    </p>
    <p>With a singular focus on this field, they offer specialized platforms for the gaming, professional visualization, data center and automotive markets.
    </p>
    <p>Their work is at the center of the most consequential mega-trends in technology - virtual reality, artificial intelligence and self-driving cars.
    </p>   


    <h2>THE WORLD LEADER IN VISUAL COMPUTING</h2>
       <p>NVIDIA  are vertically integrated and bring together GPUs, system  software, algorithms, systems and services to create unique value for the  markets They serve.</p>
    p {
font-family: "Calibri";
margin: 10px 10px 2px 10px;
float: left;
font-size: 140%;
color:ghostwhite;
}

h2 {
text-align: center;
font-family: Calibri;
color: #76b900;
margin: 3%;
}

h1 {
color: #76b900;
text-align: center;
font-family: "Calibri";
margin: 3%;
}

2 个答案:

答案 0 :(得分:0)

也许你可以看一下bootstrap。这很容易学习。如果你想在下面展示这些部分,你可以写下:

<div class="row">
  <h1>...</h1>
</div>
<div class="row">
  <p>...</p>
</div>
<div class="row">
  <h2>...</h2>
</div>
<div class="row">
  <p>...</p>
</div>

http://getbootstrap.com/

答案 1 :(得分:0)

  

基本上我想制作一个标题,然后在其下面有一个段落,然后在该段落下另一个标题和另一个标题下面的段落

只需删除段落中的float即可。

&#13;
&#13;
p {
  font-family: "Calibri";
  margin: 10px 10px 2px 10px;
  font-size: 140%;
  color: grey;
}
h2 {
  text-align: center;
  font-family: Calibri;
  color: #76b900;
  margin: 3%;
}
h1 {
  color: #76b900;
  text-align: center;
  font-family: "Calibri";
  margin: 3%;
}
&#13;
<h1>Nvidia</h1>
<p>For more than two decades, NVIDIA has pioneered visual computing, the art and science of computer graphics.
</p>
<p>With a singular focus on this field, they offer specialized platforms for the gaming, professional visualization, data center and automotive markets.
</p>
<p>Their work is at the center of the most consequential mega-trends in technology - virtual reality, artificial intelligence and self-driving cars.
</p>


<h2>THE WORLD LEADER IN VISUAL COMPUTING</h2>
<p>NVIDIA are vertically integrated and bring together GPUs, system software, algorithms, systems and services to create unique value for the markets They serve.</p>
&#13;
&#13;
&#13;