博主信息
博文 9
粉丝 0
评论 0
访问量 8973
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
HTML5 初识
空心菜博客
原创
771人浏览过

一、HTML 文档标签


文档声明为 HTML 标识网页是遵循 html5 语法规范

  1. <!DOCTYPE html>

html 网页中根标签,一个页面中有且只有一个根标签,网页中的所有内容都写在根标签的内部

  1. <html lang="en"></html>

网页的头部,head 标签中的内容

  1. <head> </head>

使用 meta 来设置页面的字符集

  1. <meta charset="UTF-8" />

网页的标题

  1. <title>我是标题</title>

网页的主体,网页中所有的可见内容,都写在 body 中

  1. <body></body>

二、html 常用标签

1.标题标签 h1~h6 共六级标题 h1 最大 h6 最小

  1. <h1>取一杯天上水</h1>
  2. <h2>取二杯天上水</h2>
  3. <h3>取三杯天上水</h3>
  4. <h4>取四杯天上水</h4>
  5. <h5>取五杯天上水</h5>
  6. <h6>取六杯天上水</h6>

2.段落标签p,块级元素,独占一行

  1. <p>取一杯天上水</p>
  2. <p>取二杯天上水</p>
  3. <p>
  4. 窗前明月光<br />
  5. 疑是地上霜
  6. </p>

3.链接标签a 跳转到指定的链接

  1. <a href="https://www.php.cn/">php中文网</a>

4.无序列表ul,li 定义无序列表

  1. <ul>
  2. <li>item</li>
  3. <li>item</li>
  4. <li>item</li>
  5. <li>item</li>
  6. </ul>

5.图像标签img

  1. <img src="nb.png" alt="" title="" width="200px" height="200px" />

6.有序列表ol,li 定义有序列表

  1. <ol>
  2. <li>item</li>
  3. <li>item</li>
  4. <li>item</li>
  5. <li>item</li>
  6. </ol>

7.自定义列表dl,dt,dd

  1. <dl>
  2. <dt>诗人</dt>
  3. <dd>李白</dd>
  4. </dl>
  5. <dl>
  6. <dt>诗人</dt>
  7. <dd>杜甫</dd>
  8. </dl>
  9. <dl>
  10. <dt>诗人</dt>
  11. <dd>苏轼</dd>
  12. <dd>苏洵</dd>
  13. </dl>

8.表格table,th,tr,td

  1. <table border="1" width="500px" height="200px">
  2. <tr style="background: cornflowerblue">
  3. <th>a</th>
  4. <th>a</th>
  5. <th>a</th>
  6. <th>a</th>
  7. </tr>
  8. <tr>
  9. <td colspan="3">横线水平合并3个a</td>
  10. <!-- <td>a</td>
  11. <td>a</td> -->
  12. <td rowspan="3">向下垂直合并三个a</td>
  13. </tr>
  14. <tr>
  15. <td>a</td>
  16. <td>a</td>
  17. <td>a</td>
  18. <!-- <td>a</td> -->
  19. </tr>
  20. <tr>
  21. <td>a</td>
  22. <td>a</td>
  23. <td>a</td>
  24. <!-- <td>a</td> -->
  25. </tr>
  26. </table>

9.表单form

1.文本域text

  1. <form action="url" method="post" name="formName">
  2. 账号: <input type="text" />
  3. </form>

2.密码password

  1. <form action="url" method="post" name="formName">
  2. 密码: <input type="password" />
  3. </form>

3.单选框radio

  1. <form action="url" method="post" name="formName">
  2. <input type="radio" name="sex" value="boy" />
  3. <input type="radio" name="sex" value="gril"/>
  4. </form>

4.多选框checkbox

  1. <form action="">
  2. 读书 <input type="checkbox" />
  3. 写字 <input type="checkbox" />
  4. 玩耍<input type="checkbox"/>
  5. </form>

5.提交按钮button

  1. <form action="">
  2. <input type="button" name="an" value="按钮" />
  3. </form>

6.重置按钮reset

  1. <form action="">
  2. <input type="reset" name="ch" value="重置" />
  3. </form>

10.下拉框select > option

  1. <select name="" id="">
  2. <option value="si">四川</option>
  3. <option value="chong">重庆</option>
  4. <option value="yun">云南</option>
  5. <option value="gui" selected>贵州</option>
  6. </select>

11.内联iframe

  1. <iframe src="http://www.runoob.com" frameborder="0"></iframe>
批改老师:PHPzPHPz

批改状态:合格

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学