身体响应图像引导程序不需要背景大小的解决方案

时间:2017-07-16 04:11:46

标签: twitter-bootstrap

经过多次努力,我无法理解为什么它不适合我

    <!DOCTYPE html>
    <html>
    <head>
    <title>harpal Quiz</title>
    <meta name="quizDescription" content="this is a quiz website">
    <meta name="keywords" content="Quiz"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://fonts.googleapis.com/css?
    family=Old+Standard+TT|Pacifico" rel="stylesheet">
    <link rel="stylesheet" 
    href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-
    alpha.3/css/bootstrap.min.css"> 
    <script 
    src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
    </script>
    <link rel="stylesheet" 
    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link href=”~/favicon.ico” rel=”shortcut icon” type=”image/x-icon” />
    <script 
    src=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js”></script>
    <link rel="stylesheet" href="css/home.css" type="text/css">
    <script src="js/quiz.js" > </script>
    <script src="js/validations.js" > </script>
  </head>
  <body  class=" img-responsive or img fluid" >
   <!--both responsive and fluid not working-->
  </body>
</html>

css文件如下

body
{
font-family: 'Old Standard TT', serif;
font-size:18px;
background-image:URL(../images/quiz.jpg);
background-repeat:no-repeat; 
}

我不想使用背景尺寸,我想要响应     为什么它没有得到回应

1 个答案:

答案 0 :(得分:0)

这不起作用,因为您通过css-property添加图像。如果有任何img标记,img-responsive类将起作用。 你必须使用背景大小。 There's a good article showing a few techniques