HTML

注意点

  1. html是不区分大小写的
  2. 建议包括嵌套，不要交叉嵌套
  3. 文件后缀名可以是.html或.htm

格式

<!------类似于java中类的大括号-------->

<html>

    <head>

        <!---head里写一些解释说明文字----->

        <title>标题</title>

    </head>

    <body>

        <!------需要给用户展示的内容------->

    </body>

</html>

标签

  1. <h1></h1>标题
  2. <p></p>段落标签
  3. <a href = ""></a>超链接标签
    • target属性

      • self：在当前窗口打开链接
      • blank：在新窗口打开链接
  4. 没有内容体的标签是空标签：<br/>，自关闭

路径

  1. 相对路径：相对于某个资源的地址

    • ./：当前路径·
    • ../：上一级目录
    • ../../：上一级再上一级目录
  2. 绝对路径：
    • 本地绝对路径

      • 指某个资源在某个盘符下的全路径
    • WEB绝对路径
      • 指某个资源在WEB应用的根地址下的全路径

图片标签

<img src = "" />u

属性：src,width,height

src指明图片路径写法：

	内网路径：

		绝对路径：文件在硬盘上的具体位置（不建议使用）

		相对路径：从引入者所在目录出发（建议使用）

	互联网路径：

		必须在网址前面加上http

		例如：http://www.baidu.com/xxx.jpg

列表标签

  1. 定义列表

  2. 有序列表

    <ol type = "">
    
    <li>第一</li>
    
    <li>第二</li>
    
</ol>

  3. 无序列表

    <ul type = "">
    
    <li>无序列表1</li>
    
    <li>无序列表2</li>
    
    <li>无序列表3</li>
    
</ul>

文字修饰标签

<b>粗体字</b>

<i>斜体字</i>

<em>着重字</em>

<strong>加强语气</strong>

转义字符

&lt : 表示`<`

&gt : 表示`>`

字体标签

<font 属性名 = “属性值”>字体标签示例</font>

格式化标签

换行：<br/>

段落标签：<p align = "left"></p>

用于划分段落，自动在段前和段后自动加空白行

属性：align

默认是left,内容居左

right 右

center 居中

标题标签：<h1></h1>

用于展示效果中划分标题，1-6级

&nbsp 空格符号，用于展示效果中显示一个空白位置

html注释：<!-----注释内容------>

超链接标签

<a href = "http://www.baidu.com">百度</a>

属性href:

	内网本机路径：相对路径和绝对路径

	互联网路径：http://地址

	本页：默认跳转到本页

注意：

1.标签体内容不仅可以是文字，也可以是其他内容，如图片

2.href属性不仅可以链接到HTML上，也可以链接到其他文件上

表格标签

<!--定义一个表格-->

<table border = "" width = "">

    <tr>

        <!---定义表格的一行--->

        <td colspan = "">

             <!---colspan是跨列合并单元格--->

             <!---rowspan是跨行合并单元格--->

             <!---定义表格的单元格--->

        </td>

        <th>

        	 <!---定义表格的表头单元格--->

             <!---内容居中加粗--->

        </th>

    </tr>

</table>

合并单元格步骤：

1.确定合并那几个单元格，是跨行还是跨列

2.在第一个出现的单元格上书写合并单元格属性

3.合并几个单元格，属性值就写多少

4.被合并的单元格必须删掉

块标签

<!-----适用于大量信息展示------->

<!-----会自动换行，默认占满一行------->

<div>内容体</div>

<!-----适用于少量信息展示------->

<!----有多少内容占多少空间，不会自动换行----->

<span>内容体</span>

表单标签

表单的作用：用来提交用户输入的数据，提交给服务器的程序

<!--1.定义一个表单-->

<form action = "" method = "">

    <!--2.在表单中定义对应的表单输入项-->

    <!--type属性确定输入框类型-->

    <input type = ""/>

    <!--下拉列表-->

    <select>

        <option></option>

    </select>

</form>

action属性：表单提交地址，默认提交到本页

method属性：设置表单的提交方式

method常见设置：get（默认方式）/post

get方式特点：

	把数据拼接到地址栏上

	敏感信息不安全

	提交数据量有限

post方式特点：

	不会拼接到地址栏上

	相对安全

	理论上提交数据量无限

推荐使用post方式

<input/>标签：

type属性：

	text:默认，文本输入框

	password:密码框，内容非明文

	radio：单选框

	checkbox:复选框

	submit:提交按钮

	reset:重置按钮

	file:附件框，用于文件上传

	hidden:隐藏域，提交服务器需要，但不需给用户看到

	button:普通按钮。需要和JS事件联用

name属性：用来分组，以及用来获取参数

value属性：设置该标签对应的数值

readonly属性:设置该标签参数只读，用户无法修改，但可提交

disabled属性：设置该标签参数不可用，不能修改也不能提交

下拉列表标签：

<select name="" multiple="multiple">

    <option value="" selected="selected">选项一</option>

</select>	

name属性：设置该标签对应的参数名

multiple属性：可以多选提交

value属性：设置需要提交的参数值

selected属性：默认选中

文本域标签：

<textarea name=""></textarea>

name属性：设置该标签对应的参数名

URL编码

URL编码解决方式：特殊符号，中文

目的是为了保证表单数据传递时能更好分出name和value，保证数据的完整性

URL编码的本质：

  1. 先进行普通的编码，编码成字节数组
  2. 字节数组中的每一个元素都会从10进制转为16进制
  3. 把已经转为16进制的字节数组，以%进行拼接，拼接出来的字符串就是URL编码的结果

HTML相关知识入门的更多相关文章

  1. HTML入门基础教程相关知识

    HTML入门基础教程 html是什么,什么是html通俗解答: html是hypertext markup language的缩写,即超文本标记语言.html是用于创建可从一个平台移植到另一平台的超文 ...

  2. Linux入门之安装及相关知识。

    一.VMware虚拟机安装与使用 1.1.VMware 简介 VMware是一个虚拟PC的软件,可以在现有的操 作系统上虚拟出一个新的硬件环境,相当于模拟 出一台新的PC.以此来实现在一台机器上真正 ...

  3. 【Python五篇慢慢弹（5）】类的继承案例解析，python相关知识延伸

    类的继承案例解析,python相关知识延伸 作者:白宁超 2016年10月10日22:36:57 摘要:继<快速上手学python>一文之后,笔者又将python官方文档认真学习下.官方给 ...

  4. Oracle 基础知识入门

    前记: 近来项目用到Oracle数据库,大学学了点,后面基本忘记得差不多了,虽然基本语法跟sql 差不多,但是oracle知识是非常多的. 这里简单说点基础知识,希望后面补上更多的关于ORacle知识 ...

  5. web跨域及cookie相关知识总结

    原文:web跨域及cookie相关知识总结   之前对于跨域相关的知识一致都很零碎,正好现在的代码中用到了跨域相关的,现在来对这些知识做一个汇总整理,方便自己查看,说不定也可能对你有所帮助. 本篇主要 ...

  6. 移动WEB像素相关知识

    了解移动web像素的知识,主要是为了切图时心中有数.本文主要围绕一个问题:怎样根据设备厂商提供的屏幕尺寸和物理像素得到我们切图需要的逻辑像素?围绕这个问题以iphone5为例讲解涉及到的web像素相关 ...

  7. listener监听器的相关知识

    从别人的博客上我学习了listener的相关知识现在分享给大家 1.概念: 监听器就是一个实现特定接口的普通java程序,这个程序专门用于监听另一个java对象的方法调用或属性改变,当被监听对象发生上 ...

  8. UIViewController相关知识

    title: UIViewController 相关知识date: 2015-12-13 11:50categories: IOS tags: UIViewController 小小程序猿我的博客:h ...

  9. 【转】java NIO 相关知识

    原文地址:http://www.iteye.com/magazines/132-Java-NIO Java NIO(New IO)是从Java 1.4版本开始引入的一个新的IO API,可以替代标准的 ...

随机推荐

  1. SQL 基础知识终极指南

    什么是数据库? 数据库是以电子方式从系统中存储和检索的大量数据集合. 存储在数据库中的结构化数据被处理.操纵.控制和更新以执行各种操作. 行业中使用的一些流行数据库是 Oracle.MySQL.Pos ...

  2. redis迁移工具redis-migrate-tool

    目录 一.简介 二.测试 三.安装 四.验证 一.简介 redis-migrate-tool是在redis之间迁移数据的一个方便且有用的工具.他会已服务方式不断同步两边的数据.等到合适时间,中断red ...

  3. Jenkins远程发布制品

    目录 一.简介 二.实现 一.简介 WEB服务很少会与Jenkins服务器在同一台机器,所以需要将构建好的制品包,发放到远程服务器进行部署. 二.实现 插件名:Publish over SSH 作用: ...

  4. 代码图形统计工具git_stats web

    目录 一.简介 二.安装ruby 三.配置git_stats 四.通过nginx把网页展示出来 一.简介 仓库代码统计工具之一,可以按git提交人.提交次数.修改文件数.代码行数.注释量在时间维度上进 ...

  5. HyperSnips：VSCode上的自动补全神器

    发现一个小众但是巨好用的VSCode自动补全插件:HyperSnips. 作者显然受到了 这位小哥 的启发,将 Vim Ultisnips 的大部分功能搬到了VSCode上.并用 JavaScript ...

  6. [BUUCTF]REVERSE——reverse1

    reverse1 附件 首先检查一下附件程序,64位,没有壳 64位ida载入,shift+f12检索程序里的字符串 我们得到了this is flag的提示,而且还看见了一个类似flag的字符串{h ...

  7. 深入理解java虚拟机(一)

    java历史 1996.01.23发布Jdk1.0 1998.12.04发布jdk1.2(里程碑的版本)注意:集合容器Collection和Map都是从1.2开始 1999.04.27HotSpot虚 ...

  8. 【LeetCode】1094. Car Pooling 拼车

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 差分数组 代码 日期 题目地址:https://le ...

  9. 【LeetCode】26. Remove Duplicates from Sorted Array 解题报告(Python&C++&Java)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 双指针 日期 [LeetCode] https:// ...

  10. 【LeetCode】665. 非递减数列 Non-decreasing Array（Python & C++）

    作者: 负雪明烛 id: fuxuemingzhu 公众号:每日算法题 本文关键词:数组,array,非递减,遍历,python,C++ 目录 题目描述 题目大意 解题方法 一.错误代码 二.举例分析 ...