Question

创建一个网页，计算特定季节产品的折扣。折扣率最高的季节是夏季（10％），新年（5％）和清仓（15％）。折扣是根据产品的价格计算的。

该网页的要求是：

网页背景色应为＃99FFFF。标签“折扣价”应为标题标签（h1），并应以斜体加粗，居中且颜色代码为＃b03060。

产品名称-名称为“名称”的文本框不能为空，只能包含字母和空格以及必填字段。

价格-名称为价格，必填字段且最小值应大于15000的数字框。

Season是一个带有标签名称“ season”的下拉框。下拉框将具有以下值和显示值

·夏天-夏季大减价

·新年-新年特惠

·清关-清仓大甩卖

表格应保留35％的对齐方式，外边框样式应为5px且边框宽度为30％。元素和边框之间的间距必须为10px。

应该显示一个提交按钮，该按钮的左对齐为45％，值为“获取折扣价格”。提交后，网页会计算产品的折扣价。

结果必须在2个div标签中显示，第一个标签的ID为“折扣”，并显示产品的折扣％，第二个标签的ID为“结果”，并显示产品的折扣价。两个div标签都应与粗体文本居中对齐。折扣价格的字体必须为斜体，＃FF0000和40px大小，折扣％为25px。 div，折扣和结果有不同的样式。

我收到错误消息：

失败1-表格标记应具有3行，并检查表格和tr的CSS要求

我的代码如下，有人可以帮助我解决此错误吗？

<html>
    <head>
        <style>
            body{
                background-color:#99FFFF;
            }
            h1{
                font-style:italic;
                text-align:center;
                font-weight:bold;
                color:#b03060;
            }
            table{
                border-collapse:collapse;
                border:5px solid black;
                width:30%;
                margin-left:35%;
            }
            tr{
                text-align:left;
            }
            td{
                padding:10px;
                border:2px solid black;
            }

            div{
                font-weight:bold;
                text-align:center;
            }
            #result{
                font-style:italic;
                color:#FF0000;
                font-size:40px;
            }
            #discount{
                font-size:25px;
            }
            #submitbutton{
                margin-left:45%;

            }

        </style>
        <script type="text/javascript">
            function validateForm(){
                var season=document.getElementById("s").value;
                var price=parseInt(document.getElementById("price").value);
                var disc;
                if(season=="summer"){
                    disc=10;
                }
                else if(season=="newyear"){
                    disc=5;
                }
                else{
                    disc=15;
                }
                var tot=(price*(100-disc))/100;
                document.getElementById("discount").innerHTML="The discount is "+disc+"%";
                document.getElementById("result").innerHTML="The discounted price : Rs "+tot;
                return false;
            }
        </script>
    </head>
    <body>
            <h1>DISCOUNT PRICE</h1>
            <form method="get" name="myform" onsubmit="return validateForm()">

                <table>
                    <tr>
                        <td>Product Name</td>
                        <td>
                            <input type="text" name="name" required pattern="[a-zA-Z\s]+">
                        </td>
                    </tr>
                    <tr>
                        <td>Product Price</td>
                        <td>
                            <input type="number" name="price" required min="15001" id="price">
                        </td>
                    </tr>
                    <tr>
                        <td>Season</td>
                        <td>
                            <select name="season" id="s">
                                <option value="summer">SUMMER SALE</option>
                                <option value="newyear">NEW YEAR SALE</option>
                                <option value="clearance">CLEARANCE SALE</option>
                            </select>
                        </td>
                    </tr>
                </table><br>
                <input type="submit" name="submit" id="submitbutton" value="GET DISCOUNT PRICE">
                </form><br>
                <div id="discount"></div><br>
                <div id="result"></div>
    </body>
</html>

我已经编写了一个JavaScript程序来创建一个计算折扣的网页，如下所示：

失败1-表格标记应具有3行，并检查表格和tr的CSS要求

0 个答案: