HTML其实就是把页面的数据封装并加上标签


表头<head>

<title> 浏览器标题栏显示的内容

<base> 有href和target属性,href指定网页中所有超链接的基本目录,target指定打开超链接的方式,如_blank为在新窗口中打开

<meta> name网页的描述信息,可以设置网页搜索的关键字keywords。http-equiv可以设置自动刷新

如:<meta http-equiv=”refresh” content=”3”;url=http://sina.com.cn” /> 设置3秒自动刷新

<link> rel属性:描述目标文档与当前文档的关系,type:文档类型,media:目标文档在哪种设备上起作用,如显示器或打印机


表单<form>

用来与服务端进行交互,意味着只要不和服务端交互就不需要form标签

<input>的type属性

  1. text:文本框

  2. password:密码框

  3. radio:单选框,需要指定同一组(即name值相同)

  4. checkbox:复选框

  5. file:文件选择

  6. hidden:隐藏组件。不会在页面上显示,但其定义的name和value可以提交给服务器

  7. botton:按钮组件。默认没有效果,可以通过注册事件并加入自定义效果

  8. submie:提交按钮

  9. reset:重置按钮

  10. image:图像组件。可以通过image的src属性连接一个按钮图片代替submit

下垃菜单<select>

每一个下拉菜单项都由option进行封装

<select>
<option></option>
<option></option>
</select>

文本区域<textarea>


表格<table>

<table>
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>

超链接<a>

<a href="http://www.sina.com.cn" target="_blank"&gt; 新浪网站<a>

http:为解析程序,即使用http协议解析链接。设置target属性,在新窗口打开链接。

<a href="mailto:abc@163.com?subject=haha&cc=qq@163.com" > 联系我们 </a>

当点击超链接时,就会出现邮件相关联的解析程序,本机默认的是outlook.

链接讯雷的解析程序可以自己百度,这里就不说了。


form标签常见属性

action

method(get和post)

get和post区别:

get会将提交的数据显示在浏览器的地址栏上,post则不会

get提交的数据的体积受地址栏的限制(即不能超过地址栏的长度),post没有这种限制

get对于敏感信息不安全(如用户名和密码),post安全

get会将提交的信息封装在请求行,即http消息头之前,post会将提交信息封装在数据何体中,即http消息头之后的空行后

对于服务器来说:

表单form提交数据尽量用post,因为涉及到编码问题。tomcat服务端默认的解码是ISO8859-1

对于post提交的中文,在服务端可以直接使用setCharacterEncoding("gbk")就可以解决。而对于get提交的中文,在服务端只能通过ISO8859-1将数据编码一次,再通过指定的码表(如GBK)解码。


其他

  1. <label>标签:当点击用户名这栏时(不是点击文本框)或按Ctrl+u快捷键,焦点也会到了文本框内
<label acdessky=”u” for=”userid”>
<tr>
<td> 用户名(U):</td>
<td> <input type=”text” name=”user” id=”userid” /></td>
</tr>
</label>

2. 书写链接地址时,必须避免重定向,例如:href="http://sina.com/",即须在URL地址后面加上"/"
3. 在页面中尽量避免使用style属性,即style="..."
4. 必须为含有描述性的表单元素(input,textarea)添加label。
```HTML

姓名:

```


5. 能以背景形式呈现的图片,尽量写入CSS样式中
6. 重要图片必须加上alt属性
7. class和id的使用:id是唯一的并是父级的,class是可以重复的并是子级的,所以id仅使用在大的模块上,class可用在重复使用率高及子级中。id原则上都是由分发框架文件时命名的,为javaScript预留钩子的除外。
8. 为javaScript预留钩子的命名,请以js_起始,比如: js _show、js _hide。

over!


HTML常见标签学习与笔记总结的更多相关文章

  1. 论文笔记:多标签学习综述(A review on multi-label learning algorithms)

    2014 TKDE(IEEE Transactions on Knowledge and Data Engineering) 张敏灵,周志华 简单介绍 传统监督学习主要是单标签学习,而现实生活中目标样 ...

  2. 每天成长一点---WEB前端学习入门笔记

    WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...

  3. 学习ReactNative笔记整理一___JavaScript基础

    学习ReactNative笔记整理一___JavaScript基础 ★★★笔记时间- 2017-1-9 ★★★ 前言: 现在跨平台是一个趋势,这样可以减少开发和维护的成本.第一次看是看的ReactNa ...

  4. 强化学习读书笔记 - 02 - 多臂老O虎O机问题

    # 强化学习读书笔记 - 02 - 多臂老O虎O机问题 学习笔记: [Reinforcement Learning: An Introduction, Richard S. Sutton and An ...

  5. (转)深度学习word2vec笔记之基础篇

    深度学习word2vec笔记之基础篇 声明: 1)该博文是多位博主以及多位文档资料的主人所无私奉献的论文资料整理的.具体引用的资料请看参考文献.具体的版本声明也参考原文献 2)本文仅供学术交流,非商用 ...

  6. 深度学习word2vec笔记之基础篇

    作者为falao_beiliu. 作者:杨超链接:http://www.zhihu.com/question/21661274/answer/19331979来源:知乎著作权归作者所有.商业转载请联系 ...

  7. FPGA_VHDL 学习课堂笔记001

    FPGA_VHDL 学习课堂笔记   记录说明:本文档主要记录大学期间,老师FPGA授课课堂笔记. 代码语言:VHDL 编程软件:MAX+plus II FPGA硬件:FLE-843   03月05日 ...

  8. 深度学习课程笔记(二)Classification: Probility Generative Model

    深度学习课程笔记(二)Classification: Probility Generative Model  2017.10.05 相关材料来自:http://speech.ee.ntu.edu.tw ...

  9. 深度学习课程笔记(一)CNN 卷积神经网络

    深度学习课程笔记(一)CNN 解析篇 相关资料来自:http://speech.ee.ntu.edu.tw/~tlkagk/courses_ML17_2.html 首先提到 Why CNN for I ...

随机推荐

  1. Nginx源码研究三:Epoll在NGINX中的使用

    Web服务器在面对高并发的情况下,网络的IO一般选择IO复用,像apache选择的Select/poll.Nginx在linux 2.6后选择Epoll做网路IO,提高了WEB服务的并发能力. 在本章 ...

  2. web安全:xss && csrf

    首先在user.php文件中去除黑名单的第一行标签,在白名单中添加<script>E1:csrf攻击zoobarcsrf:cross-site request forgery    跨站伪 ...

  3. HEX和BIN文件的区别

    以下的内容是从网上转载来的,原文地址:http://blog.csdn.net/zhangliang_571/article/details/8519469  在这里感谢原作者. 1,是在keil中编 ...

  4. GPIO的8种模式详解

    和stm32的GPIO相关的寄存器有 (1)两个32位的配置寄存器(GPIOX_CRL,GPIOX_CRH) 每一个IO占用4位,16个IO占用64位就是两个32为寄存器. 其中CNF[1:0]是用来 ...

  5. grunt serve Warning: Running "sass:server" (sass) task

    使用grunt serve运行时遇到一问题: y@y:ydkt$ grunt serve Running "serve" task Running "clean:serv ...

  6. PHP vs Java

    http://www.phpddt.com/reprint/php_font-java_end.html http://www.zhihu.com/question/20314377 http://b ...

  7. Thinking in C++: 第1章 为什么C++会成功

    本文内容摘抄自C++经典书籍:<Thinking in C++>   操作概念:OOP程序像什么 我们已经知道,用C 语言编写的过程程序就是一些数据定义和函数调用.要理解这种程序的含义,程 ...

  8. centos6.5+Django+mysql+nginx+uwsgi

    centos6.5+Django+mysql+nginx+uwsgi 1.nginx的安装.这里采用nginx-1.6.0, 建立一个shell脚本然后执行. #!/bin/bash nginx_ve ...

  9. USACO6.5-Closed Fences:计算几何

    Closed Fences A closed fence in the plane is a set of non-crossing, connected line segments with N c ...

  10. Spring MVC中各个filter的用法

    转载:http://blog.csdn.net/qyp1314/article/details/42023725 Spring MVC中各个filter的用法 2014-12-19 09:08 105 ...