Jquery 为什么我在CSS中的样式不起作用，因为我在HTML文件和CSS文件中给出了适当的类名？_Jquery_Html_Css_Twitter Bootstrap_Twitter Bootstrap 3

Jquery 为什么我在CSS中的样式不起作用，因为我在HTML文件和CSS文件中给出了适当的类名？

jquery html css twitter-bootstrap twitter-bootstrap-3

Jquery 为什么我在CSS中的样式不起作用，因为我在HTML文件和CSS文件中给出了适当的类名？,jquery,html,css,twitter-bootstrap,twitter-bootstrap-3,Jquery,Html,Css,Twitter Bootstrap,Twitter Bootstrap 3,有了“meta”链接，我就一切正常，如果我在开发工具中添加新样式，它就会正常工作，但如果我在崇高的文本中添加相同的新样式，它就不工作了，它什么也不做。这是我的HTML代码index.HTML： </!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> &l

有了“meta”链接，我就一切正常，如果我在开发工具中添加新样式，它就会正常工作，但如果我在崇高的文本中添加相同的新样式，它就不工作了，它什么也不做。这是我的HTML代码index.HTML：

</!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Ferrari</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/ie10-viewport-bug-workaround.css" rel="stylesheet">
    <link href="css/navbar-fixed-top.css" rel="stylesheet">
    <script src="js/ie-emulation-modes-warning.js"></script>
</head>
<body>

<div>
<nav class="navbar navbar-fixed-top navbar-inverse">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="logo" href="#"><img src="gfx/ferrari-logo.jpg" alt="Ferrari logo" /></a>
        </div>
        <div id="navbar" class="collapse navbar-collapse ">
          <ul class="nav navbar-nav navbar-right ">
            <li class="active "><a href="#">HOME</a></li>
            <li><a href="#">ABOUT</a></li>
            <li><a href="#">DESIGN</a></li>
            <li><a href="#">CONTACT</a></li>
          </ul>
       </div>
     </div>
</nav>
</div>

   <center>
     <video  width="800" src="video/ferrari_458.mp4" controls></video>
   </center>

<div class="container">
   <h1 class="h1">Design</h1>
   <h4 class="center">Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.</h4><br><br>

   <h4 class="center">Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.</h4><br><br>

   <h4 class="center">Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</h4>
</div>

<div class="col-lg-4">
          <img class="img-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
          <h2>Heading</h2>
          <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
          <p><a class="btn btn-default" href="#" role="button">View details »</a></p>
        </div>

<div class="col-lg-4">
          <img class="img-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
          <h2>Heading</h2>
          <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
          <p><a class="btn btn-default" href="#" role="button">View details »</a></p>
        </div>

<div class="col-lg-4">
          <img class="img-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
          <h2>Heading</h2>
          <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
          <p><a class="btn btn-default" href="#" role="button">View details »</a></p>
        </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery.min.js"><\/script>')</script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/ie10-viewport-bug-workaround.js"></script>

  </body>
</html>

我必须做什么才能使它工作？

您有“剩余填充：”但没有提供值。css很可能由于语法错误而中断

您可能想要删除这一行，或者为属性设置所需的值，而不提供值。css很可能由于语法错误而中断

您可能要删除此行或为属性设置所需的值

出现语法错误：

左填充：

没有值。换句话说，您需要学习基本调试，例如打开浏览器的调试控制台并查找错误消息。您试图更改什么？您没有padding-left的值。此外，除非我遗漏了什么，否则您不会在tag@AlexJohnson如果他想将另一个元素样式设置为类似于

h1

？您有一个语法错误：

左填充：

没有值。换句话说，您需要学习基本调试，例如打开浏览器的调试控制台并查找错误消息。您试图更改什么？您没有padding-left的值。此外，除非我遗漏了什么，否则您不会在tag@AlexJohnson如果他想将另一个元素的样式设置为类似于

h1

？

.container {
    position: relative;
}

.center {
    position: absolute;
    padding-left: 
    left: 80px;
    top: 50%;
    width: 100%;
    text-align: center;
    font-size: 18px; 
    white-space: pre; 
}

.h1, h1 {
    font-size: 250%;
    color: aqua;
}