Question

我正在设计一个具有粉红色背景和深粉红色标题文本的表单。我的 CSS 的其余部分似乎在工作，只是没有颜色标签。这是我的代码：

<!DOCTYPE html>
<html>
<head>  
    <style>
        body{
           background-color: "#E6E6FA";
        }
        h1{
            color:"#800080";
            font-family:cursive;
            text-align:center;
            
        }
        td#curricularActivity{
           background-color:"#00FFFF";
        }
    </style>
</head>

<body>
    <h1>MONTHLY EXPENSES CALCULATOR</h1>
    <form onsubmit="return calculateExpenses()">
    <center>
        <table>
            
        <tr><td>Group Head Name</td>
        <td>
            <label for="groupHeadName" name="Group Head Name"></label>
            <input type="text" id="groupHeadName" name="groupHeadName" placeholder="Enter the Group Head Name"
            pattern="[A-Za-z ]+" required>
        </td>
        </tr>
        <tr><td>Email ID</td>
        <td>
            <label for="groupHeadEmail" name="EMail ID"></label>
            <input type="email" name="groupHeadEmail" id="groupHeadEmail" required>
        </td>
        </tr>
        
        <tr><td>Mobile Number</td>
        <td>
            <label for="groupHeadMobileNumber" name="Mobile Number"></label>
            <input type="text" id="groupHeadMobileNumber" name="groupHeadMobileNumber" placeholder="Enter the Mobile Number"
            pattern="^[789]{1}[0-9]{9}$" required>
        </td>
        </tr>
        
        <tr><td>Extra-Curricular Activity</td>
        <td>
            <label for="curricularActivity" name="Extra-Curricular Activity"></label>
            <input type="radio" id="curricularActivity" name="curricularActivity" value="Karate" required="">Karate
            <input type="radio" name="curricularActivity" id="curricularActivity2" value="Music" required>Music
        </td>
        </tr>
        
        <tr><td>No of Girls</td>
        <td>
            <label for="noOfGirls" name="No of Girls"></label>
            <input type="range" id="girlseval" max="500" min="0" required>
            <span id="demo">
        </span></td>
        </tr>
        
        <tr><td>No of Boys</td>
        <td>
        <label for="noOfBoys" name="No of Boys"></label>
        <input type="range" id="boyseval" max="500" min="0" required>
        <span id="demo1"></span>
        </td>
        </tr>
        
        <tr><td>
            <input type="submit" id="submit" value="Calculate Monthly Expense">
        </td>
        <td>
            <input type="reset" id="reset" value="Reset">
        </td></tr>
        
    </table>
    <div id="result"></div>
    </center>
    </form>
    
</body>
</html>

如何使颜色按要求显示？我已经在 Chrome 和 Firefox 中尝试过代码。两个浏览器都有问题。

Answer 1

 body{
       background-color: #E6E6FA;
    }
    h1{
        color:#800080;
        font-family:cursive;
        text-align:center;
        
    }
    td#curricularActivity{
       background-color:#00FFFF;
    }

请从上面的代码中删除 Css 样式中的颜色值中的双引号。 check your working code here with corrected styling

为什么颜色和背景颜色标签在我的 CSS 代码中不起作用？

1 个答案: