<body>内常用标签

1、<div>和<span>

<div></div> : <div>只是一个块级元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现. 
<span></span>: <span>表示了内联行(行内元素),并无实际的意义,主要通过CSS样式为其赋予不同的表现.

块级元素与行内元素的区别
所谓块元素,是以另起一行开始渲染的元素,行内元素则不需另起一行。如果单独在网页中插入这两个元素,不会对页面产生任何的影响。
这两个元素是专门为定义CSS样式而生的。

2、列表标签

<!--无序列表 [type属性:disc(实心圆点)(默认)、circle(空心圆圈)、square(实心方块)]-->
<ul>
<li>列表中的每一项.</li>
</ul>
<!--有序列表-->
<ol>
<li>:列表中的每一项.</li>
</ol>
<!--定义列表-->
<dl>
<dt> 列表标题</dt>
<dd> 列表项</dd>
</dl>

3、表单标签: <form>

功能:表单用于向服务器传输数据,从而实现用户与Web服务器的交互

表单能够包含input系列标签,比如文本字段、复选框、单选框、提交按钮等等。

表单还可以包含textarea、select、fieldset和 label标签。

1)表单属性

action: 表单提交到哪.一般指向服务器端一个程序,程序接收到表单提交过来的数据(即表单元素值)作相应处理,比如https://www.sogou.com/web

method: 表单的提交方式 post/get默认取值就是get

2)表单元素

基本概念:

HTML表单是HTML元素中较为复杂的部分,表单往往和脚本、动态页面、数据处理等功能相结合,因此它是制作动态网站很重要的内容。表单一般用来收集用户的输入信息

表单工作原理:

访问者在浏览有表单的网页时,可填写必需的信息,然后按某个按钮提交。这些信息通过Internet传送到服务器上。 服务器上专门的程序对这些数据进行处理,如果有错误会返回错误信息,并要求纠正错误。当数据完整无误后,服务器反馈一个输入完成的信息

4、<input>系列标签

<1> 表单类型
type:
text:文本输入框
password:密码输入框
radio:单选框
checkbox:多选框
submit:提交按钮
button:按钮(需要配合js使用.) button和submit的区别?
file:提交文件:form表单需要加上属性enctype="multipart/form-data"
上传文件注意两点:
1 请求方式必须是post
2 enctype="multipart/form-data" <2> 表单属性 name: 表单提交项的键.
注意和id属性的区别:name属性是和服务器通信时使用的名称; 而id属性是浏览器端使用的名称,该属性主要是为了方便客户端编程,而在css和javascript中使用的
value:表单提交项的值.对于不同的输入类型,value 属性的用法也不同:
type="button", "reset", "submit" - 定义按钮上的显示的文本
type="text", "password", "hidden" - 定义输入字段的初始值
type="checkbox", "radio", "image" - 定义与输入相关联的值
checked: radio 和 checkbox 默认被选中
readonly: 只读. text 和 password
disabled: 对所用input都好使.

1)select标签

 <select> 下拉选标签属性
name:表单提交项的键.
size:选项个数
multiple:multiple
<optgroup>为每一项加上分组
<option> 下拉选中的每一项 属性:
value:表单提交项的值.
selected: selected下拉选默认被选中

2)<textarea> 多行文本框

'''

<form id="form1" name="form1" method="post" action="">
<textarea cols=“宽度” rows=“高度” name=“名称”>
默认内容
</textarea>
</form> '''

3)<label>标签

定义:<label> 标签为 input 元素定义标注(标记)。
说明:
1 label 元素不会向用户呈现任何特殊效果。
2 <label> 标签的 for 属性值应当与相关元素的 id 属性值相同。

<form method="post" action="">
<label for=“username”>用户名</label>
<input type=“text” name=“username” id=“username” size=“20” />
</form>

4)<fieldset>标签

<fieldset>
<legend>登录吧</legend>
<input type="text">
</fieldset>

html标签补充的更多相关文章

  1. html 常用标签补充

    <body> <!--预处理标签 <pre>--> <pre> 你好, 空格 换3行. 你<sup>上标</sup>好<s ...

  2. HTML之body标签中的相关标签补充

    一 列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: a.ul:unordered list,“无序列表”的意思. b.li ...

  3. meta标签补充属性(viewport)

    我们在开发移动设备的网站时,最常见的的一个动作就是把下面这个东西复制到我们的head标签中: <meta name="viewport" content="widt ...

  4. 学习前端 第一天之html标签补充

    一.常用浏览器内核 Trident(IE内核) Gecko(firefox) webkit(Safari) Chromium/Blink(chrome) Blink(Opera) 二.常见标签回顾 a ...

  5. [Web 前端] 005 html 常用标签补充

    少废话,上例子 1. 正常的字 <br> <tt>小一点的字体</tt> <br> <small>变小</small> < ...

  6. Django基础回顾与补充(79-80)

    Django框架之回顾与补充(d79-80)一 HTTP协议:(重点)  1 请求   -请求首行    -GET /index HTTP/1.1   -请求头部(在django框架中,可以从META ...

  7. html 标签学习(续)

    一.基础标签补充 1.div 标签和span标签 (没有特别的样式,常用) div标签用来定义一个块级元素,并无实际的意义.主要通过CSS样式为其赋予不同的表现. span标签用来定义内联(行内)元素 ...

  8. jQuery查找标签--选择器,筛选器,模态对话框, 左侧菜单栏

    查找标签 选择器: 基本选择器(同css) id选择器 $("#id") 标签选择器 $('tagName') class选择器 $(".className") ...

  9. DOM对象之查找标签&属性操作

    HTML DOM (文档对象模型) DOM(Document Object Model)是一套对文档的内容进行抽象和概念化的方法. JavaScript对DOM进行了实现,对应于JavaScript中 ...

随机推荐

  1. 第五篇 elasticsearch express插入数据

    1.后端 在elasticsearch.js文件夹下添加: function addDocument(document) { return elasticClient.index({ index: i ...

  2. SpringSecurity04 利用JPA和SpringSecurity实现前后端分离的认证和授权

    1 环境搭建 1.1 环境说明 JDK:1.8 MAVEN:3.5 SpringBoot:2.0.4 SpringSecurity:5.0.7 IDEA:2017.02旗舰版 1.2 环境搭建 创建一 ...

  3. spring 4.0 JUnit简单的Dao,Service测试

    1.AbstractTransactionalJUnit4SpringContextTests 和AbstractJUnit4SpringContextTests.我们在测试用例类要继承两种中的一个. ...

  4. [原创]SQL表值函数:返回自定义时间段的日期数据

    跟以往类似,我依旧介绍一个我日常开发遇到的知识点,谨此记录一下,也希望能帮助到一些朋友. 这次我要介绍的是通过SQL函数返回你输入的两个时间点内的日期数据. 效果图如下: 执行函数:SELECT * ...

  5. ASCII 说明

    ASCII 说明 ASCII 码使用指定的 7 位或 8 位二进制数组合来表示 128 或 256 种可能的字符.标准 ASCII 码也叫基础ASCII码,使用 7 位二进制数来表示所有的大写和小写字 ...

  6. vue入门(一)----组件

    由于工作需要,最近在写一些前端的东西.经过向开发经验丰富的前端工程师的请教之后,得出一个结论----2016年前端被玩坏了,其实对于我来说我并不是太了解这句话的深刻含义,只是觉得是不是因为前端技术突飞 ...

  7. 《OD学spark》20160924scala基础

    拓展: Hadoop 3.0 NameNode HA NameNode是Active NameNode是Standby可以有多个 HBase Cluster 单节点故障? HBaster -> ...

  8. 《OD大数据实战》Spark入门实例

    一.环境搭建 1. 编译spark 1.3.0 1)安装apache-maven-3.0.5 2)下载并解压 spark-1.3.0.tgz 3)修改make-distribution.sh  VER ...

  9. springboot jpa mongodb 多条件分页查询

    public Page<Recorded> getRecordeds(Integer page, Integer size, Recorded recorded) { if (page&l ...

  10. Task :rn-splash-screen:verifyReleaseResources FAILED

    Execution failed for task ':rn-splash-screen:verifyReleaseResources'. > java.util.concurrent.Exec ...