纯HTML练习_1（任务来自百度前端学院）

本文链接：https://blog.csdn.net/qq_37002892/article/details/79792522

    <title>HTML任务一</title>
    <base target="_blank" />
</head>
<body>
    <nav>
        <div><h1>网站一级标题</h1></div>
        <div>
            <ul>

                <a href="http://www.baidu.com"><li>导航链接一</li></a>
                <a href="http://ww.baidu.com"><li>导航链接二</li></a>
                <a href="http://ww.baidu.com"><li>导航链接三</li></a>
                <a href="http://www.baidu.com"><li>导航链接四</li></a>

            </ul>
        </div>

    </nav>
    <div class="" id="">
        <h2>文章二级标题</h2>
    </div>


    <div>
        <p>文章作者文章发表时间</p></br><!--[if IE]>

        <![endif]-->
        <p>这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，</p>
        </br> 
        <p>这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是<a href="http://www.baidu.com">这里有一个链接到http://www.baidu.com</a>一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，</p>
    </div>
    <img src="img/300.jpg" />
    <div>

        <h1>
            另一篇文章标题
        </h1>
        <h2>文章二级标题</h2>
        <div>
            <p>文章作者及文章发表时间</p>
        </div>
        <div>这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，这是一个很长的段落，</div>
    </div>
    <div>
        <ul>
            <li>列表项目一</li>
            <li>列表项目二</li>
            <li>列表项目三</li>
            <li>列表项目四</li>
        </ul>
    </div>
    <h2>图片</h2>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <div>
        <p>好看的图片</p><br />
        <img src="img/2.jpg" />
    </div>
    <!--===============================================================================-->

    <div>
        <h1>最后一篇文章一级标题</h1>

    <h2>文章二级标题</h2>
    </div>
    <div>
        <ol>
            <li>排名一</li>
            <li>排名二</li>
            <li>排名三</li>
        </ol>
    </div>

    <div>
        <p>下面是一个表格border=1好让你看出这是一个表格</p>
        <table border="1";cellcellspacing="0";cellpcellpadding="0">
            <tr>
                <th>表头</th>
                <th>表头</th>
                <th>表头</th>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>总计</td>
                <td colspan="2">1000</td>
            </tr>
        </table>
    </div>

    <div>
        <h1>这里以后是一个侧栏，这是侧栏标题</h1>
        <h2>侧栏注册窗口欧标题</h2>
    </div>
    <div>

        <form action="";mmethod="",nname="">
            请输入邮箱地址：<input type="text" placeholder="这是一个文本输入域" /><br />
            邮箱地址请安要求各时输入<br />
            请输入密码：<input type="password" placeholder="这是一个文本输入域" maxlength="16" min="6"/>               请输入密码：<input type="password" placeholder="这是一个文本输入域" />

密码请为6-16位的英文数字

        </form>

        性别：
        <input type="radio" name="haha"  checked="checked"/>男
        <input type="radio" name="haha"/>女
        城市：
        <select name="">
        <option selected="selected">北京</option>
        <option>河北</option>
        <option>河南</option>
        <option>天津</option>

        </select>
        <span>
            <input type="checkbox" name="cc" />运动

            <input type="checkbox" name="cc" />艺术

            <input type="checkbox" name="cc" />科学

        </span>

        个人描述：<textarea cols="6"; rows="8" placeholder="这是一个多行输入框，输入您的个人描述"></textarea>
        <button type="submit" value="确认提交"></button>
        <br />
        版权所有&copy;
    </div>
</body>