关于HTML常用标签

2018-03-28  本文已影响0人  奈_4f97

1.DOCTYPE 用来选择文档类型

<!DOCTYPE html>  //用于html5 

2.HTML

 <html> 元素 表示一个HTML文档的根(顶级元素),所所以它也被称为 根元素 。其他所有其他元素必须是此元素的后代。

3.head

 <head> 元素 规定文档相关的通用信息(元数据),包括文档的标题,文档的样式和脚本的链接(定义)等。

>> <title>标题</title>

>><meta charset="utf-8"> 用来告知服务器客户端处理文字的字符集

head标签中还可以写入调用CSS  JS等文件路径

4.body

body 元素表示HTML文档内容所在之处。一个文档中只允许有一个 body 元素。

5.div与span

Division元素(div)是流内容的通用容器。在使用CSS进行样式化之前,它不会影响内容或布局。

span元素是用于短语内容的通用内联容器,

#SPAN与DIV 是没有样式的需要利用CSS进行定义#

5.<img src="#" alt="logo">

IMG引用图像元素  SRC为引用图像地址  alt在图像无法加载时会显示的文字

6.nav main footer

NAV用于导航标签

MAIN用于内容部分

FOOTER 用于页脚

7.ul li & ol li

<ul><li>无序列表</li></ul>  是无序列表(即无数值排序项的集合) UL中可以包含多个li 

头部会有点· 可以利用CSS中list-style-type 设置

<ol><li>有序列表</li></ol> 表示多个有序列表项,通常渲染为有带编号的列表

#大多用于写菜单&列表#

8. H1 -H6

h1 - h6元素代表六个级别的标题。h1是最高部分水平,而h6是最低水平

#一般用于标题#

9.p

表示文本的一个段落。该元素通常表现为一整块与相邻文本分离的文本,或以垂直的空白隔离或以首行缩进。**另外,p 是 块级元素 **。

#通常用于标记一段文字#

10.hr

就是一条水平分割线

11.dl dt dd

dl 元素 (或 HTML 描述列表元素 )是一个包含术语定义以及描述的列表,通常用于展示词汇表或者元数据 (键-值对列表)。

 dt 元素 <键>(或 HTML 术语定义元素 )用于在一个定义列表中声明一个术语。该元素仅能作为 dl 的子元素出现。通常在该元素后面会跟着 dd 元素, 然而,***多个连续出现的 dt 元素都将由出现在它们后面的第一个 dd 元素定义***。

dd 元素 <值>( HTML 描述元素 )用来指明一个描述列表  ( dl ) 元素中一个术语的描述。这个元素只能作为描述列表元素的子元素出现,**并且必须跟着一个 dt 元素**。

12. <a href="#"> #跳转页面为 GET请求

a 元素  (或锚元素) 可以创建一个到其他网页、文件、同一页面内的位置、电子邮件地址或任何其他URL的超链接。

#标题这样的写法会弹到网页最上边 如果想点击链接页面没有变化 利用javascript伪类#

#GET 获取内容  POST 提交内容#

13.from 跳转页面为 POST请求

<iframe src="#" frameborder="0" name="1111"></iframe>

<from action="users" method="post" target="111">

     <input type="text" name=" username">

     <input type="password" name="password">

     <input type="submit" value="提交">

    <lable> <input type="checkbox">前端</lable>

    <lable><input type="radio" name="hed" value="yes"></lable>

    <lable><input type="radio" name="hed"  value="no"></lable>

        #<button>提交</button>#

     <select name="group"  multip>

    <option value="0">-</option>

     <option value="1" disabled>第一组</option>

    <option value="2" selected>第二组</option>

     <select>

     <textarea  name="" cols="12" rows="12"></textarea>

</from>

--------

from标签用于为用户输入创建 HTML 表单。

action 属性规定当提交表单时,向何处发送表单数据 #from中不可缺少的标签#

method 属性规定如何发送表单数据(表单数据发送到 action 属性所规定的页面)

target 属性规定在何处打开 action 提交的地址。

_blank在新窗口/选项卡中打开。

_self在同一框架中打开。(默认)

_parent在父框架中打开。

_top在整个窗口中打开。

framename在指定的框架中打开。

-----------------------

lable 可以包含input 会默认是input进入选中状态

-----------------------

input  文本框 其中name属性必写不然无法提交 type="submit"提交  具体参阅https://developer.mozilla.org/zhCN/docs/Web/HTML/Element/Input/number

常用的有

text :文本框

checkbox: 复选框

radio:单选按钮 raido 的name相同的只会选中一个

button 会自动升级为提交按钮  默认是一个submit按钮 

参阅

https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input

------------------

select 下拉列表

option为select的子元素

multip 此属性可以让下拉列表中的选项多选

disabled 不可选状态

selected 默认排名第一

--------------------

 textarea 表示一个多行纯文本编辑控件  cols 列数  rows 行数 

14.table 表格

<table>

<colgroup>  

    <col width=100> 控制列的宽度

</colgroup>

     <thead>  //表头

               <tr>

                    <th>姓名</th>

            </tr>    

    </thead>

    <tbody>  //内容

            <tr>

                 <th></th><td>小明</td>    

            </tr>

</tbody> 

<tfoot> //......

        <tr>

            <td>100</td>

       </tr>

</tfoot>

</table>

上一篇 下一篇

猜你喜欢

热点阅读