Question

有人会知道为什么CSS无法在我的HTML中工作吗？它链接到我的html，但是不起作用。在chrome inspect-css选项卡中它也显示为空。我看到css正在链接，但不确定为什么它不起作用。.谢谢您！


    <!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Quierra Marriott</title>

      <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
      <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
      <link rel="stylesheet" type="text/css" href="main.css">
</head>


    * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 10px
    font-family: 'Roboto', sans-serif;
    color: #eee;``
}

body {
    width: 100%;
    height: 100%;
    background: url() no-repeat center fixed;
    background-size: cover;
}

Answer 1

您的CSS无效：

html {
    font-size: 10px /* You're missing a semi-colon here*/
    color: #eee;`` /* You don't need the strings `` here...*/
...

您可能会发现w3c css验证程序之类的工具https://jigsaw.w3.org/css-validator/。

Answer 2

缺少分号和空字符串是问题，但它们仅影响html选择器的font-size属性。

如果您打算为主体添加背景，则应填写图片网址


body {
    width: 100%;
    height: 100%;
    background: url('http://image-url.com/image') no-repeat center fixed; 
    background-size: cover;
}

这是空白页的主要原因

Answer 3

在您的HTML中没有看到任何“ body”标签，这就是我认为它不起作用的原因

谁知道为什么CSS无法在我的HTML中正常工作？

3 个答案: