HTML的入门及一些常用标签与其属性
*这是一个HTML文档
<html><!--html文档的根标签--> <head><!-- 头标签--> <title>peizeng</title><!--标题标签--> </head> <body><!-- 体标签--> <font color='red'>Hello world</font><br/> <!-- br/换行标签--> <font color='green'>Hello world</font><br/> <h1>防火工作</h1> <!-- h1到h6依次为标题的大小 --> <p> 一、高度重视冬季防火工作。目前已进入冬季，风干物燥，用火、用电、用油、用气增加，元旦、春节即将来临，人流、物流集中， 各种庆祝集会和传统民俗文化活动频繁，火灾事故隐患增多，防控难度加大，消防安全形势将更加严峻。 各县市区、各部门、各单位负责人要针对本地区、本部门、本单位消防工作存在的薄弱环节，组织制定各项防范措施，坚决防止重特大火灾事故的发生。 </p> <p> 二、严格落实消防安全责任制。各县市区人民政府全面负责本地区消防工作，政府主要负责同志为第一责任人，分管负责同志为主要责任人。 要层层落实责任，把任务分解到部门、单位和个人。各单位负责人对本单位消防安全工作负总责，进一步落实消防安全责任制和岗位责任制。 要加大火灾事故责任追究力度，实行责任倒查和逐级追查，做到事故原因不查清不放过、事故责任者得不到处理不放过、整改措施不落实不放过、教训不吸取不放过。 发生重大火灾事故的，除追究单位主要负责人和实际控制人责任外，还要追究地方负责人和上级单位主要负责人的责任； 触犯法律的，依法追究单位主要负责人、单位实际控制人和上级单位负责人的法律责任。 </p> <p> 三、认真组织开展消防安全大检查活动。 </p> <!--段落标签 p--> <!--hr标签 显示一条水平线--> <hr color='red'> <h2>文本标签</h2> <!--b标签 加粗--> 白日依山尽<br/> <b>白日依山尽</b><br/> <!--i标签 斜体--> 黄河入海流<br/> <i>黄河入海流</i><br/> <!--font标签 字体标签--> 欲穷千里目<br/> <font color='red' size='3'>欲穷千里目</font><br/> <!--center居中标签--> 更上一层楼<br/> <center> 更上一层楼<br/> </center> <!-- 其中font与hr标签各有一定的属性 hr有color，width，size，align（对齐方式center居中，left居左，right居右） font有color，size，face（字体） 属性的取值： color： 1.直接接颜色单词 2.rgb（值1，值2，值3），值的范围0~225 3.#值1值2值3：值的范围00~FF之间。 width： 1.数值：width=‘20’。单位为像素 2.数值%：相当于屏幕的一个比例。例：50%。 --> <!-- 加载图片使用img标签。 <img src=http://www.mamicode.com/”相对路径.jpg“> --> <hr color='red'> <h2>列表标签</h2> <!-- *有序列表 *<ol> *<li> *无序列表 *<ul> *<li> --> <ol> <li>白日依山尽</li> <li>黄河入海流</li> <li>欲穷千里目</li> <li>更上一层楼</li> </ol> <ul> <li>白日依山尽</li> <li>黄河入海流</li> <li>欲穷千里目</li> <li>更上一层楼</li> </ul> <hr color='red'> <h2>链接标签</h2> <!-- a:定义一个超链接 属性： href:指定访问资源的URL（统一资源定位符） target:指定打开资源的方式 _self:默认值，在当前页面打开 _blank:在空白页面打开 --> <a href='https://www.cnblogs.com/pzbangbangdai/'>这是一个超链接</a><br> <a href='https://www.cnblogs.com/pzbangbangdai/' target='_blank'>这还是一个超链接</a> <hr color='red'> <h2>表格标签</h2> <!-- *table:定义表格 *tr:定义行 *td:定义单元格 *colspan:合并列 *rowspan:合并行 *th:定义表头单元格 *caption:表格标题 --> <table border='1' width='50%' cellpadding='0' cellspacing='0'> <caption>学生信息表</caption> <tr> <th>学号</th> <th>姓名</th> <th>成绩</th> </tr> <tr> <td>01</td> <td>张三</td> <td>70</td> </tr> <tr> <td>02</td> <td>李四</td> <td>80</td> </tr> </table> <hr color='red'> <h2>表单标签</h2> 概念：用于采集用户输入的数据 <!-- form :用于定义表单。可以定义一个范围，范围代表采集用户数据的范围 属性： action:指定提交数据的URL methon:指定提交方式。常用的两类： get：请求参数会在地址栏中显示 post：请求参数不会在地址栏中显示 要想数据被提交，必须指定name属性 --> <form action='#' method='get'> 用户名：<input name='username'><br> 密码：<input name='password'><br> <input type='submit' value='登录'> </form> <hr color='red'> <h2>表单项标签</h2> <!-- *input:可以通过type属性值，改变元素展示的样式 *type属性： *text:文本输入框 *placeholder:输入提示信息 *password:密码输入框 *radio：单选框 *注意如果有多个单选框则name属性值必须一样 *每一个单选框的value属性一般指定被选择中提交的值 *通过添加checked属性指定其为默认选项 *checkbox：多选框 *每一个单选框的value属性一般指定被选择中提交的值 *通过添加checked属性指定其为默认选项 *file:文件选择框 *submit：按钮 *hidden：隐藏域，用于提交一下信息 *label：指定输入框的文字描述信息（即点击一个框的文字信息光标就会跳转至其框中） *注意label的for属性值要与input的id属性值对应 *select:下拉标签 *子元素：option,指定列表项 *textarea:文本域 *cols:指定列数 *rows:指定行数 --> <form action='#' method='post'> <table border='1' width='500' align='center'> <tr> <td><label for='username'> 姓名</label></td> <td><input name='username' type='text' id= 'username'></td> </tr> <tr> <td><label for='password'> 密码</label></td> <td><input name='password' type='password' id= 'password'></td> </tr> <tr> <td><label for='email'> 邮箱</label></td> <td><input name='email' type='email' id= 'email'></td> </tr> <tr> <td><label > 性别</label></td> <td><input name='gender' type='radio' value='male'>男 <input name='gender' type='radio' value='female'>女 </td> </tr> <tr> <td><label for='birthday'> 生日</label></td> <td><input name='birthday' type='date' id= 'birthday'></td> </tr> <tr> <td colspan='2' align='center'><input type='submit' value='注册'> </label> </td> </tr> <table> </form> </body> </html>HTML的入门及一些常用标签与其属性
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/8627.html
- 上一篇：nodejs 实现接口
- 下一篇：基于 B/S 端构建的 3D 楼宇自控可视化监控
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")