HTML相关知识入门
HTML
注意点
- html是不区分大小写的
- 建议包括嵌套,不要交叉嵌套
- 文件后缀名可以是
.html
或.htm
格式
<!------类似于java中类的大括号-------->
<html>
<head>
<!---head里写一些解释说明文字----->
<title>标题</title>
</head>
<body>
<!------需要给用户展示的内容------->
</body>
</html>
标签
<h1></h1>
标题<p></p>
段落标签<a href = ""></a>
超链接标签- target属性
- self:在当前窗口打开链接
- blank:在新窗口打开链接
- target属性
- 没有内容体的标签是空标签:
<br/>
,自关闭
路径
- 相对路径:相对于某个资源的地址
./
:当前路径·../
:上一级目录../../
:上一级再上一级目录
- 绝对路径:
- 本地绝对路径
- 指某个资源在某个盘符下的全路径
- WEB绝对路径
- 指某个资源在WEB应用的根地址下的全路径
- 本地绝对路径
图片标签
<img src = "" />u
属性:src,width,height
src指明图片路径写法:
内网路径:
绝对路径:文件在硬盘上的具体位置(不建议使用)
相对路径:从引入者所在目录出发(建议使用)
互联网路径:
必须在网址前面加上http
例如:http://www.baidu.com/xxx.jpg
列表标签
定义列表
有序列表
<ol type = "">
<li>第一</li>
<li>第二</li>
</ol>
无序列表
<ul type = "">
<li>无序列表1</li>
<li>无序列表2</li>
<li>无序列表3</li>
</ul>
文字修饰标签
<b>粗体字</b>
<i>斜体字</i>
<em>着重字</em>
<strong>加强语气</strong>
转义字符
< : 表示`<`
> : 表示`>`
字体标签
<font 属性名 = “属性值”>字体标签示例</font>
格式化标签
换行:<br/>
段落标签:<p align = "left"></p>
用于划分段落,自动在段前和段后自动加空白行
属性:align
默认是left,内容居左
right 右
center 居中
标题标签:<h1></h1>
用于展示效果中划分标题,1-6级
  空格符号,用于展示效果中显示一个空白位置
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编码的本质:
- 先进行普通的编码,编码成字节数组
- 字节数组中的每一个元素都会从10进制转为16进制
- 把已经转为16进制的字节数组,以%进行拼接,拼接出来的字符串就是URL编码的结果
HTML相关知识入门的更多相关文章
- HTML入门基础教程相关知识
HTML入门基础教程 html是什么,什么是html通俗解答: html是hypertext markup language的缩写,即超文本标记语言.html是用于创建可从一个平台移植到另一平台的超文 ...
- Linux入门之安装及相关知识。
一.VMware虚拟机安装与使用 1.1.VMware 简介 VMware是一个虚拟PC的软件,可以在现有的操 作系统上虚拟出一个新的硬件环境,相当于模拟 出一台新的PC.以此来实现在一台机器上真正 ...
- 【Python五篇慢慢弹(5)】类的继承案例解析,python相关知识延伸
类的继承案例解析,python相关知识延伸 作者:白宁超 2016年10月10日22:36:57 摘要:继<快速上手学python>一文之后,笔者又将python官方文档认真学习下.官方给 ...
- Oracle 基础知识入门
前记: 近来项目用到Oracle数据库,大学学了点,后面基本忘记得差不多了,虽然基本语法跟sql 差不多,但是oracle知识是非常多的. 这里简单说点基础知识,希望后面补上更多的关于ORacle知识 ...
- web跨域及cookie相关知识总结
原文:web跨域及cookie相关知识总结 之前对于跨域相关的知识一致都很零碎,正好现在的代码中用到了跨域相关的,现在来对这些知识做一个汇总整理,方便自己查看,说不定也可能对你有所帮助. 本篇主要 ...
- 移动WEB像素相关知识
了解移动web像素的知识,主要是为了切图时心中有数.本文主要围绕一个问题:怎样根据设备厂商提供的屏幕尺寸和物理像素得到我们切图需要的逻辑像素?围绕这个问题以iphone5为例讲解涉及到的web像素相关 ...
- listener监听器的相关知识
从别人的博客上我学习了listener的相关知识现在分享给大家 1.概念: 监听器就是一个实现特定接口的普通java程序,这个程序专门用于监听另一个java对象的方法调用或属性改变,当被监听对象发生上 ...
- UIViewController相关知识
title: UIViewController 相关知识date: 2015-12-13 11:50categories: IOS tags: UIViewController 小小程序猿我的博客:h ...
- 【转】java NIO 相关知识
原文地址:http://www.iteye.com/magazines/132-Java-NIO Java NIO(New IO)是从Java 1.4版本开始引入的一个新的IO API,可以替代标准的 ...
随机推荐
- 使用plantuml,业务交接就是这么简单
使用plantuml,业务交接就是这么简单 你好,我是轩脉刃. 最近交接了一个业务,原本还是有挺复杂的业务逻辑的,但发现交接过来的项目大有文章,在项目代码中有一个docs文件夹,里面躺着若干个 pum ...
- centos7源码安装Nginx-1.6
目录 一.环境介绍 二.安装 三.使用验证 四.附录 编译参数详解 一.环境介绍 nginx的版本功能相差不大,具体支持可以查看官网的功能列表 环境信息: [nginx-server] 主机名:hos ...
- [BUUCTF]PWN——babyfengshui_33c3_2016
babyfengshui_33c3_2016 附件 步骤: 例行检查,32位程序,开启了cannary和nx 本地运行一下看看大概的情况,熟悉的堆的菜单布局 32位ida载入,看main函数 add ...
- CSAcademy Prefix Suffix Counting 题解
CSAcademy Prefix Suffix Counting 题解 目录 CSAcademy Prefix Suffix Counting 题解 题意 思路 做法 程序 题意 给你两个数字\(N\ ...
- 怎么从svn服务器上把工程导入到MyEclipse里
怎么从svn服务器上把工程导入到MyEclipse里,步骤如下:
- libevent源码学习(15):信号event的处理
目录信号event处理流程与信号event相关的结构体初始化工作创建一个信号event添加一个信号event信号回调函数信号event的激活 Libevent中的event,主要分为三大类 ...
- JAVA结合Redis处理缓存穿透问题
public List<WeixinMenu> getList() { List<WeixinMenu> weixinMenuList= (List<WeixinMenu ...
- JAVA里List集合中的对象根据对象的某个属性值降序或者升序排序
需要使用JDK1.8及以上 package com.stream; import java.util.Comparator; import java.util.List; public class T ...
- windows10下vscode+cmake编译Qt5代码(2)
概述 本文依赖 前文 本文将介绍使用cmake语法屏蔽运行Qt exe的cmd窗口 解决办法 配置VS项目属性, 缺点: cmake重新 configure后,项目属性会重置,再次运行还将出现cmd弹 ...
- 【LeetCode】766. Toeplitz Matrix 解题报告
作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 方法一:两两比较 方法二:切片相等 方法三:判断每条 ...