练习1:百度前端技术学院 - 零基础 HTML 编码

最新推荐文章于 2024-04-23 10:04:21 发布

RecordInLife

最新推荐文章于 2024-04-23 10:04:21 发布

阅读量530

点赞数 1

文章标签：前端

本文链接：https://blog.csdn.net/itzhengmaolin/article/details/75274830

版权

http://www.earnfish.com/article/1494078696419

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>网站的一级标题???</h1>
    <ul>
        <li>导航链接一</li>
        <li>导航链接二</li>
        <li>导航链接三</li>
        <li>导航链接四</li>
    </ul>
    <h1>文章一级标题</h1>
    <h2>文章二级标题</h2>
    <pre>文章作者 文章发表时间  **pre 元素中的文本通常会保留空格和换行符**</pre>
    <p>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,换行了</p>
    <br>
    <p>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落</p>
    <p>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落 , <a href="www.baidu.com">链接到百度</a>这是一个很长很长的段落,<strong>这里**粗体**</strong>这是一个很长很长的段落,</p>
    <img src="1.jpg">
    <a href="www.sina.com" **target="blank"**>点击在新窗口打开新浪</a>

    <br>
    <ol>
        <li>排名1</li>
        <li>排名2</li>
        <li>排名3</li>
    </ol>
    <table border="1px solid black">
        <tr>
            <th>表头</th>
            <th>表头</th>
            <th>表头</th>
        </tr>
        <tr>
            <td>表内容单元格</td>
            <td>表内容单元格</td>
            <td><a href="#">操作</a></td>
        </tr>
        <tr>
            <td>表内容单元格</td>
            <td>表内容单元格</td>
            <td><a href="#">操作</a></td>
        </tr>
        <tr>
            <td>表内容单元格</td>
            <td>表内容单元格</td>
            <td><a href="#">操作</a></td>
        </tr>
        <tr>
            <td>表内容单元格</td>
            <td>表内容单元格</td>
            <td><a href="#">操作</a></td>
        </tr>
        <tr>
            <td>总计</td>
            <td **colspan="2"** align="center">1000</td>
        </tr>
    </table>

    <form>
        请输入邮箱地址:<input type="text" name="" placeholder="这是一个文本输入框">
        <br>
        请输入密码:<input type="password" name="" placeholder="这是一个文本输入框">
        请重复输入密码:<input type="password" name="" **placeholder="这是一个文本输入框"**>
        <br>
        性别：<input type="radio" name="sex" id="boy"> <label for="boy">男</label>   <input type="radio" name="sex" id="girl"><label for="girl">女</label>
        <br>
        城市:<select>
            <option>北京</option>
            <option>上海</option>
            <option>广州</option>
        </select>
        爱好:<input type="checkbox" name="hobby" value="sport">运动
        <input type="checkbox" name="hobby" value="art">艺术
        <input type="checkbox" name="hobby" value="science">科学
        个人描述: <textarea cols="5" rows="5">这是一个多行输入框</textarea>
        <input type="button" name="" value="确认提交">
        <div>版权所有&copy;</div>
    </form>
</body>
</html>

需要注意的点:
1、a标签链接到的地方是本窗口还是新窗口可以使用target属性
2、col 是跨列 row跨行
3、label标签一般和id绑定input标签即当点击label的文本时会锁定input标签例: 选择性别的时候

<input type="radio" name="sex" id="girl"><label for="girl">女</label>

4、实体符号版权使用©

RecordInLife

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
练习1:百度前端技术学院 - 零基础 HTML 编码

http://www.earnfish.com/article/1494078696419<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <h1>网站的一级标题???</h1> <ul> <li>导
复制链接

扫一扫