Question

我正在尝试使标题宽度相等，这意味着如下图所示，但它不是那样的。

它应该如下所示这只是为了我自己从网上的随机psd中学习。我的代码也是准确的是使用px是否正确我应该使用百分比，我应该更多地使用bootstrap和标题。

这是以下代码的样子

css使用了style.css

.header-text
{

    font-size:30pt
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
     width: 220px;
    margin-left:40px;
    margin-top:54;
     text-align: center;
    float:left;
}

.header
{
    height:240px;
 }
div>div.header-logo
{
    background-image: url("logo.png");
    width: 240x;
    height: 270px;
    background-repeat: no-repeat;
    margin-left: 600px;
    margin-top: 30px;
}

div>div.expert-reviews
{
    float:left;
      font-size:30pt
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
}

body > div > div:nth-child(3)
{
    float:right;
      font-size:30pt
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
}

HTML

<!DOCTYPE html>
<html>
<head>

   <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <link rel="stylesheet" href="style.css">
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

    <body>
    <div class="header">
        <div class="header-text">100+ Years Of Combiend Industry Expierence</div>

                               <div class="header-logo"></div>    
        <div class"expert-reviews"> Expert Consumer Reviews and Ratings</div>

    </body>
</html>

Bootstrap标头，但使用px未正确对齐

0 个答案: