---是什么？超文本标记语言
---能干什么？描述网页的一种语言
---怎么干？一套标签

前端三剑客的关系：

　　1. HTML是网页内容的载体。
　　2. CSS样式是表现。
　　3. JavaScript是用来实现网页上的特效效果。

几个注意点：

　　1.HTML不区分大小写
　　2.一般而言标签都是成对出现的，一些特殊的标签（如换行），应当在标签内结束 <br/>
　　3.语义化
HTML的操作思想：
　　网页中有很多不同的数据，不同的数据需要不同的显示效果，需要进行相关的封装，再进行相关标签属性的修改

常用标签（注意红色标签）

　　1.文字标签和注释标签
　　<font size="" color=""></font> 1.英文单词表示法 2.使用十六进制 #FFFFFF RGB三原色表示法
　　<!--这是一个注释-->

　　注意：

　　style 属性淘汰了旧的 "align" 属性。
　　style 属性淘汰了旧的 <font> 标签。
　　style 属性淘汰了“旧的” bgcolor 属性。

　　2.标题标签 水平线标签和特殊字符
　　<h1></h1> 1到6依次变小
　　<hr/> 同样拥有size 和color属性
　　对<>等进行转义 < &lt; > &gt; &nbsp;

　　3.列表标签:一般有缩进的考虑列表标签
　　<dl></dl>:表示标签的范围
　　　　子标签： <dt></dt>上层
　　　　　　　　<dd></dd>下层
　　<ol></ol>：表示有序列表的范围,拥有排序方式属性：type 常见type="1或a或i"
　　　　　　　　子标签：<li></li>
　　<ul></ul>:表示无序列表的范围，拥有type属性
　　　　　　子标签：<li></li>

　　4.图像标签
　　<img src="图片路径"/>：拥有width height title alt等属性
　　5.路径的介绍
　　绝对路径 相对路径
　　当前路径./ 上层路径../

　　6.超链接标签
　　链接资源
　　<a href="为#时仅为占位符">链接显示内容</a>
　　target _blank新窗口打开 _self当前页面打开
　　定位资源
　　<a name="top">顶部</a>
　　<a href="#top">回顶部</a>

　　7.表格标签
　　<table></table>:表示表格的范围，拥有align border等（<caption>表格标题）
　　　　子标签 行：<tr></tr> 下一级 单元格：<td></td>
　　类似于表头（可以实现居中和加粗）<th></th>
　　跨行跨列标签：rowspan colspan

　　8.表单标签：数据的提交 交互等 【重要】
　　<form></form>:定义表单的范围，拥有action（提交地方）method（提交方法）
　　get:地址栏会携带提交的信息，不安全，信息大小有限制
　　post:信息在请求体里面，理论上没有限制
　　　　子标签：大部分输入项标签由<input/>实现（标签内结束） 由type属性选择
　　【注意】type以及定位标签的name属性等。
　　　　type="text" 普通文本框
　　　　type="password" 密码输入框
　　　　type="radio" 单选输入框
　　　　（要有相同的name属性值以及区分的value值,checked默认选中
　　　　type="checkbox" 复选框（同上
　　　　type="file" 文件输入框
　　　　type="hidden" 隐藏项
　　　　type="submit" value="提交按钮上内容"提交
　　　　注意submit范围应当在</form>前才是提交里面的内容啊
　　　　提交表单需要控件有name属性
　　　　

　　　　使用图片提交
　　　　　　<input type="image" src=""/>
　　　　下拉标签： <select name="">
　　　　<option value=""></option>
　　　　　　　　　　</select>
　　!文本域：<textarea cols="" rows=""></textarea>

　　9.其它标签
　　<b></b> 加粗
　　<u></u> 下划线
　　<i></i> 斜体
　　<s></s> 删除线
　　<pre></pre> 原样输出，会换行
　　<sub></sub> 上标
　　<sup></sup> 下标
　　<p></p> 段落标签

　　***CSS中的常见标签***
　　<div></div> 容器标签，设置单独的样式 自动换行
　　<span></span> 不换行

　　10.头标签
　　<head></head>
　　　　子标签： <title></title>
　　<meta>:提供页面有关的信息，实现定时跳转等功能。
　　<base>：设置超链接的基本信息等。如target
　　<link>:引入外部文件

11.框架集标签：使用时必须去掉整个body，已过时，被div所替代
　　<frameset> ：拥有rows cols标签来表示划分方式，
　　<frame> ：常用name与src属性
　　<frame>：在href处使用target=frame的name位置处
　　</frameset>

小问题：使用框架集时，会出现页面套页面的不正确显示结果
　　　　最简单的解决方式是：在form标签里使用target="_parent"，设置打开位置为父页面

JavaWeb基础—HTML小结的更多相关文章

  1. JavaWeb基础知识总结

    JavaWeb基础知识总结.   1.web服务器与HTTP协议 Web服务器 l WEB,在英语中web即表示网页的意思,它用于表示Internet主机上供外界访问的资源. l Internet上供 ...

  2. JavaWeb基础: ServletContext

    基本概念 Web容器在启动时,会为每个Web应用程序都创建一个对应的ServletContext对象,它代表当前Web应用. ServletContext(javax.servlet.http.Ser ...

  3. VB6 GDI+ 入门教程[5] 基础绘图小结

    http://vistaswx.com/blog/article/category/tutorial/page/2 VB6 GDI+ 入门教程[5] 基础绘图小结 2009 年 6 月 18 日 4条 ...

  4. JavaWeb基础: 学习大纲

    JavaWeb基础: Web应用和Web服务器 JavaWeb基础: Tomcat JavaWeb基础:HTTP协议和基于Restful的架构 JavaWeb基础: Web工程配置文件 JavaWeb ...

  5. 超详细的Java面试题总结（四 ）之JavaWeb基础知识总结

    系列文章请查看: 超详细的Java面试题总结(一)之Java基础知识篇 超详细的Java面试题总结(二)之Java基础知识篇 超详细的Java面试题总结(三)之Java集合篇常见问题 超详细的Java ...

  6. Mybatis之基础应用小结以及IntelliJ IDEA目录结构的一些小问题

    IntelliJ IDEA 目录结构的一些小问题 [Mybatis 之基础应用小结] 1.不管怎么样,先建立一个简单的MySQL数据表,如下所示 2.接下来要做的事情就是通过Mybatis对数据表进行 ...

  7. javascript之正则表达式基础知识小结

    javascript之正则表达式基础知识小结,对于学习正则表达式的朋友是个不错的基础入门资料.   元字符 ^ $ . * + ? = ! : | \ / ( ) [ ] { } 在使用这些符号时需要 ...

  8. 关于java基础、多线程、JavaWeb基础、数据库、SSM、Springboot技术汇总

    作者 : Stanley 罗昊 本人自行总结,纯手打,有疑问请在评论区留言 [转载请注明出处和署名,谢谢!] 一.java基础 1.多态有哪些体现形式? 重写.重载 2. Overriding的是什么 ...

  9. JavaWeb基础—XML学习小结

    一.概述 是什么? 指可扩展标记语言 能干什么? 传输和存储数据 怎么干? 需要自行定义标签. XML 独立于硬件.软件以及应用程序 通常.建立完xml文件后首要的任务是:引入约束文件! 二.XML简 ...

随机推荐

  1. 记一次es和mq的netty冲突

      1.今天在服务里面加了 es 6.4的 依赖包后,在预发布测试时候出现了下列的问题 看了 半天,最后发现是 es的 jar包 和 mq的 netty包 有冲突.然后去idea的 jar包依赖里面查 ...

  2. Web程序中打开QQ、邮箱、阿里旺旺等

    在网页中使用链接打开QQ的聊天窗口有两种方式: uin的值为qq号 <a target="_blank" href="@Url.Content("tenc ...

  3. Oracle EBS 复制用户职责

    DECLARE l_new_user_name ) := 'HAND_HYL'; l_new_password ) :'; l_new_user_id NUMBER; l_user_name_copy ...

  4. C#.NET里面抽象类，接口，虚方法

    1抽象类 (1) 抽象方法只作声明,而不包含实现,可以看成是没有实现体的虚方法 (2) 抽象类不能被实例化 (3) 抽象类可以但不是必须有抽象属性和抽象方法,但是一旦有了抽象方法,就一定要把这个类声明 ...

  5. Man's Best Friend: The Science Behind the Dog and Human Relationship

    http://info.thinkfun.com/stem-education/mans-best-friend-the-science-behind-the-dog-and-human-relati ...

  6. Linux 系统的IP与域名解析文件[局域网的DNS]

    系统的IP与域名解析文件[局域网的DNS] 局域网的DNS: 域名和主机名对应的工具,服务器直接通过域名,方便迁移 # 修改配置 vim /etc/hosts 直接添加: 192.138.25.129 ...

  7. 铁乐学python_day20_面向对象编程2

    面向对象的组合用法 软件重用的重要方式除了继承之外还有另外一种方式,即:组合 组合指的是,在一个类中以另外一个类的对象作为数据属性,称为类的组合. 例:人狗大战,人类绑定上武器来对狗进行攻击: # 定 ...

  8. python3: 字符串和文本(2)

    6. 字符串忽略大小写的搜索替换 >>> text = 'UPPER PYTHON, lower python, Mixed Python' >>> re.find ...

  9. Jmeter入门3 http请求—content-type与参数

    本文讲三种content-type以及在Jmeter中对应的参数输入方式 第一部分:目前工作中涉及到的content-type 有三种: content-type:在Request Headers里, ...

  10. JDK/bin目录下的不同exe文件的用途

    新安装完JDk 大家是否发现安装目录的bin文件夹有很多exe文件 下面就为大家讲解不同exe文件的用途 javac:Java编译器,将Java源代码换成字节代 java:Java解释器,直接从类文件 ...