使用 html5 和 css.Getting 以下错误生成注册表单时出现以下错误

Question

使用 html5 和 css 构建注册表时出现以下错误。
带有输入类型字段、一个下拉列表和按钮的注册表单。使用 html5 和 css.
生成注册表时出现以下错误带有输入类型字段、一个下拉列表和按钮的注册表单。使用 html5 和 css.
生成注册表时出现以下错误带有输入类型字段、一个下拉列表和按钮的注册表单。

 <!DOCTYPE html>
    <html>
    <head>
      <link rel="icon" href="favicon.png" type="image/png">
      <title>Destiny</title>
      <link href="mystyle.css" rel="stylesheet" type="text/css">
    </head>
    
     <body>
    
      <h1>Registration Form</h1>
    
     <div id="container">
      <form>
    
       <label for="name"  >Name:</label>
       <input type="text" name="name" id="select" value=""style=" margin-left:120px;float:centre; position:relative;"></br></br>
    
      <label for="date" >Date of Birth:</label>
      <input type="date" name="date"  id="select" value="" style=" margin-left:75px;padding-right:15px;float:centre; position:relative;"></br></br>
    
      <label for="country">Country:</label>
      <input list="browsers" name="country"  style="margin-left:110px;position:absolute;">
      <datalist id="browsers">
        <option value="India"></option>
        <option value="United States"></option>
        <option value="United Kingdom"></option>
        <option value="Austraila"></option>
        <option value="France"></option>
      </datalist></br></br>
    
      <label for="phone">Phone number:</label>
      <input type="tel" name="phone" style="margin-left:65px;"></br></br>
    
      <label for="email">Email:</label>
      <input type="email" name="email" style="margin-left:118px;float:centre;"></br></br>
    
      <label>Website:</label>
      <input type="url" style="margin-left:105px;float:centre;"></br></br>
    
     </form>
    </div>
    
    
    <button type="submit">Submit</button>
    
    </body>
    </html>

CSS 文件

body {
        /*  background-image: url("https://farm6.staticflickr.com/5695/22447126166_2db1545ed4_b.jpg");*/
     
     background-color: #e0d8cc;
    
    }
    header{
        width: 100%;
        height: 80px;
        background-color: #cc6533;
        display: inline-block;
    }
    
    header a:hover{
        color: orange;
    }
    h1{
        margin: 13px 15px 12px 13px;
    
        color:black
    }
    input{
        border: 1px solid #cc6533;
      border-radius: 4px 0px 0px 4px;
    }
    form{
        margin: 47px 0px 0px 34px;
    }
    #container{
        margin-left: 11px;
        width: 500px;
        height: 300px;
        border-radius: 4px;
        border: 1px solid #cc6533
    }
    button{
        border-radius: 4px;
        border: none;
        padding: 4px 9px 5px 10px;
        margin: 6px 0px 0px 452px;
        background-color: #cc6533;
    }
    select{
        border-radius: 0px 4px 4px 0px;
        border: none;
        background-color: #cc6533;
        padding: 1px;
    }

测试类 test_webpage.py

    from bs4 import BeautifulSoup
    import pytest
    import pickle
    import requests
    
    class TestWebpage:
        @pytest.fixture(autouse=True)
        def get_soup(self):
            index_page = requests.get("http://localhost:8000/index.html")
            soup_index = BeautifulSoup(index_page.content, 'html.parser')
            self._index = soup_index
            
        # testing index.html
        def test_indexpage(self):
            assert self._index.find_all('form')
            assert self._index.body.h1.string=='Registration Form'
            site = self._index.find('form')
            assert self._index.find('form')
            site1 = site.find_all('input')
            count = 0
            for input in site1:
                count +=1
            assert count==6
            assert self._index.find('datalist')
            site2=site.find_all('datalist')
            site3=self._index.find_all('option')
            count = 0
            for option in site3:
                count +=1
            assert count==5
            assert self._index.find_all('input', {'type': 'text'})
            assert self._index.find_all('input', {'type': 'date'})
            assert self._index.find_all('input', {'type': 'email'})
            assert self._index.find_all('input', {'type': 'tel'})
            assert self._index.find_all('input', {'type': 'url'})

Getting following error

            def test_indexpage(self):
        
                assert self._index.find_all('form')
        
                assert self._index.body.h1.string=='Registration Form'
        
                site = self._index.find('form')
        
                assert self._index.find('form')
        
                site1 = site.find_all('input')
        
                count = 0
        
                for input in site1:
        
                    count +=1
        
        >       assert count==6
        
        E       assert 1 == 6
        
        test/test_webpage.py:23: AssertionError

Answer 1

HTML 页面中 break 标记的语法在整个代码中使用不正确。

应该是<br>而不是</br>

Answer 2

  <h1>Registration Form</h1>

这个标签必须放在标签里面

 <div id="container">

注册表

. . .

Answer 3

<!DOCTYPE html>
<html>
<head>
  <link rel="icon" href="favicon.png" type="image/png">
  <title>Destiny</title>
  <link href="mystyle.css" rel="stylesheet" type="text/css">
</head>
<body>
 //write your code here
 
 <h1>Registration Form</h1>
 <div id="container">
  <form>
    <label for="name">Name:  </label>
    <input type="text" name="name">
    <br/><br/>
    <label for="dateofbirth">Date of Birth:  </label>
    <input type="date" name="dateofbirth">
    <br/><br/>
    <label for="country">Country:  </label>
    <input list="browsers" name="country">
    <datalist id="browsers">
       <option value="india">India</option>
      <option value="United States">United States</option>
      <option value="United Kingdom">United Kingdom</option>
      <option value="austraila">Austraila</option>
      <option value="France">France</option>
    </datalist>
    <br/><br/>
    <label for="phonenumber">Phone number: </label>
    <input type="tel" name="phonenumber">
    <br/><br/>
    <label for="email">Email:  </label>
    <input type="email" name="email">
    <br/><br/>
    <label for="website">website:  </label>
    <input type="url" name="website">

  </form>
 </div>

 <button type="submit">Submit</button>

 
</body>
</html>

Answer 4

您的 HTML 页面没有任何问题。编译器正在寻找表格的名称，使用这个：

    <h1>Registration Form</h1>    
    <form id="registrationForm" name="Registration Form">
    ....
    ....
    </form>
    <input type="submit" form="registrationForm">

抱歉回答晚了，但对我有用。

使用 html5 和 css.Getting 以下错误生成注册表单时出现以下错误

Getting following errors buliding registration form using html5 and css.Getting following errors

html

css

registration

注册表