一、HTML概述 二、web相关的概念 三、HTML的常用标签
一、HTML概述
###<1>概念
HTML:Hypertext Markup Language,超文本 标记语言，用来描述网页的一种语言。
非编程语言，由浏览器直接解释运行。
###<2>作用
编写网页,显示网页数据
###<3>特点
此语言编写的文件，以html或者htm为后缀。
由一组标签组成，不区分大小写。
XML:标签自定义，存储数据，传输数据
HTML:标签固定，每一个标签具有特定的含义，存储数据，传输数据
标签由开始和结束标签组成，开始标签<标签名> 表示，结束标签使用</标签名>表示
标准的HTML文件的结构：
<!DOCTYPE~> //代表HTML的版本，表明当前的HTML文件使用哪种版本的语法来进行编写
<HTML> //表示页面的开始
<HEAD>
//放置一些页面的设置参数
<TITLE>标题标签</TITLE>
</HEAD>
<BODY background="" bgcolor="">
//网页的主体部分，在浏览器上直接显示的内容
</BODY>
</HTML>
# 二、Web相关的概念
URL:统一资源定位符，互联网上资源的地址。可以通过URL找到互联网上的某一个具体的资源。
可以标识一张图片，一部电影，或者一个HTML页面
HTTP协议:超文本传输协议，服务器端和客户端请求和应答的标准。
B/S结构：浏览器和服务器模式
统一了客户端，将功能的实现全部交给服务器去实现，简化了开发，维护的成本。
浏览器：解析和显示HTML文件的软件。
HTML文件解析（SAX,DOM）
HTTP请求数据包和响应数据包的封装和解析
# 三、HTML常用标签
###1.标签和属性
标签由开始和结束标签组成，开始标签<标签名> 表示，结束标签使用</标签名>表示
元素指的是包含标签在内整体，除去标签的部分叫做内容。
标签允许嵌套
属性在开始标签中指定，表示标签的性质和特征，通常表示为：属性名=“属性值” ，多个属性使用空格隔开
###2.颜色的指定方式
方式一：使用颜色的名称
方式二：使用十六进制指定，在#后面把RGB三原色的各个数值使用十六进制表示出来。
使用六位：#ffff00 ,黄色
使用三位：#ff0 ，黄色
###3.资源指定方式
在HTML中，使用URL来访问，指定资源
绝对路径：以http://资源路径，或者c://资源的路径
相对路径：以当前位置为标准，指定资源路径
./ 当前位置
../上一级目录位置
../../上一级的上一级目录位置
###4.<meta> 标签
<meta 属性 =“属性值” ...>
设置整个页面的属性
此标签在<head>标签内部使用
例如：
<meta charset="字符编码" /> 表示该HTML文件使用的字符编码
<meta name="keywords" content="五一小长假，春游小长假" />
<meta name="autor" content="作者姓名"/>
<meta http-equiv="refresh" content="秒数；url= "/> 页面倒转功能
content="秒数"
url="跳转的页面"
例如：<meta http-equiv="refresh" content="5;url=demo2.html"/>
###5.<body>标签
<body text="red" bgcolor="green" background="./htmlsrc/k11.jpg">
<!-- 给body指定字体颜色 -->
<!-- 给body指定背景颜色 -->
<!-- 给body指定背景图片 -->
###6. 文本类标签
区域标签：
<fieldset>
<legend>描述信息</legend>
内容
</fieldset>
标题标签：<h1> ...<h6>
<h1>定义最大标题
<h6>定义最小标题
段落标签：<p>段落</p>
保留数据源格式的标签：
<pre></pre>
设置文本格式：
<s></s> ,<del></del> 删除线
<b></b> 加粗
<sup></sup> 上标
<sub></sub> 下标
<u></u> 下划线
<i></i> 斜体
<br> 回车换行
<font 属性>文本</font> 文本标签，face="字体" size="字号" color="颜色"
<big></big>
<small></small>
特殊符号：
空格
< <
> >
" "
... ...
设置对齐方式：
属性的方式align = "对齐方式"
设置居中的标签：<center>数据</center> ，居中显示数据
超链接标签：<a href="">名称</a>
hreft属性：指定链接的url，位置
跳转到特定的位置：
<a name="位置标识" >
<a href="#位置名称" > 跳转到头部</a>
跳转到其他页面：
<a href="url位置" ></a>
绝对路径：http://www.baidu.com:80/ -----百度服务器----默认的项目------index.html
相对路径：./demo1.html
图片标签：<img/> 显示图片
属性：src="url位置"
width="宽度"
height="高度"
alt="替代文件"
border="边框"
align="对齐方式"
<img src="" alt="加载失败" width="300" height="500"/>
列表标签：<ol> <ul> <li>
<ol>
<li></li>
<li></li>
<li></li>
</ol>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
###7.结构类
表格标签：<table > <tr> <td>
<table border="边框"></table> :整个表格
<tr></tr> :单独一行
<th></th> :单独一行，标题使用
<td>数据</td> :一列
属性：border,设置表格的边框
background,设置背景图片
bgcolor，设置背景颜色
cellspacing,设置单元格之间的距离
cellpadding,设置单元格内部的数据和边框的距离
rowspan，垂直方向合并单元格
colspan，水平方向合并单元格
align ,行的对齐方式
valign,列的对齐方式
<thead></thead>:表头部分
<tbody></tdody>：主体部分，可以有多个
<tfoot></foot>：标底部分
分区标签：<div> <span> 分区
区块标签:<div></div>
<h1> <p> <table> <tr>
内联标签：<span>
<a> <img> <td>
###8.框架类
<frameset rows="" cols="">
<frame src="left.html"></frame>
<frame name="right"></frame>
</frameset>
###9.表单类（将表单中的数据发送给服务器的）
<form action="服务器的url" method="传输的方式"> 数据</form>
URL:用来接收和处理表单数据的组件，Servlet
method:get、post
制作不同功能的按钮：<input type="按钮的类型" value="按钮上显示的名称" name="名字">
<input type="button" value="按钮上显示的名称" name="名字"> 一个普通按钮
<input type="submit" value="按钮上显示的名称" name="名字"> 一个提交按钮
<input type="reset" value="按钮上显示的名称" name="名字"> 一个重置按钮
<input type="image" value="按钮上显示的名称" name="名字" url=""> 一个图片按钮
制作文本框：
<input type="text" value="输入框中默认的数据" size="宽度" maxlength="字符的最大输入数量" name="标识输入框">
<input type="password" value="输入框中默认的数据" size="宽度" maxlength="字符的最大输入数量" name="标识输入框">
<textarea name="标识输入框" rows="行数" cols="列数" >
制作单选和多选按钮：
男 <input type="radio" name="标识" value="男">
<input type="checkbox" value="男" name="标识">
制作菜单：
<select name="标识">
<option>内容1</option>
<option>内容2</option>
<option selected>内容3</option>
</select>
一、HTML概述 二、web相关的概念 三、HTML的常用标签的更多相关文章
- html5--1.3 元素的概念与3个常用标签
html5--1.3 元素的概念与3个常用标签 学习要点 1.元素的概念 2.3个常用的标签 HTML 元素指的是从开始标签到结束标签的所有代码. 开始标签 元素内容 结束标签 <h1> ...
- 一、JavaScript概述 二、JavaScript的语法 三、JavaScript的内置对象
一.JavaScript的概述###<1>JavaScript的概念 又称ECMAScript,和java没有任何关系 嵌入在HTML元素中的 被浏览器解释运行的 一种脚本语言. ###& ...
- 一、Linux概述 二、Linux的安装 三、Linux的常用命令（重点）
一.Linux概述###<1>操作系统 OS,管理和控制 计算机的 硬件和软件资源的 计算机程序. 最基本的系统软件. 是用户和计算机交互的桥梁,是硬件和软件交互的桥梁. 操作系统:she ...
- Android程序员学WEB前端(1)-HTML(1)-标准结构常用标签-Sublime
转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76522043觉得博文有用,请点赞,请评论,请关注,谢谢!~ 8月份了,换工作有2个月了 ...
- Spring Framework------>version4.3.5.RELAESE----->Reference Documentation学习心得----->Spring Framework中web相关的知识（概述）
Spring Framework中web相关的知识 1.概述: 参考资料:官网documentation中第22小节内容 关于spring web mvc: spring framework中拥有自 ...
- linux设备驱动归纳总结（二）：模块的相关基础概念【转】
本文转载自:http://blog.chinaunix.net/uid-25014876-id-59415.html linux设备驱动归纳总结(二):模块的相关基础概念 系统平台:Ubuntu 10 ...
- 【Linux开发】linux设备驱动归纳总结（二）：模块的相关基础概念
linux设备驱动归纳总结(二):模块的相关基础概念 系统平台:Ubuntu 10.04 开发平台:S3C2440开发板 xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx ...
- 二 web爬虫，scrapy模块以及相关依赖模块安装
当前环境python3.5 ,windows10系统 Linux系统安装 在线安装,会自动安装scrapy模块以及相关依赖模块 pip install Scrapy 手动源码安装,比较麻烦要自己手动安 ...
- Direct3D11学习：（二）基本绘图概念和基本类型
转载请注明出处:http://www.cnblogs.com/Ray1024 一.概述 在正式开始学习D3D11之前,我们必需首先学习必要的基础知识. 在这篇文章中,我们将介绍一下Direct3D ...
随机推荐
- 远程通信机制RPC与RMI的关系
1.RPC RPC(Remote Procedure Call Protocol)远程过程调用协议,它是一种通过网络从远程计算机程序上请求服务,而不需要了解底层网络技术的协议.RPC不依赖于具体的网 ...
- 169.254地址无网关信息 ----- 解决方案 启动DHCP服务
169.254.X.X是Windows操作系统在DHCP信息租用失败时自动给客户机分配的IP地址,.看到地址的时候没有网关. 解决方案 启动DHCP服务 1. 首先确认 路由器 DHCP 服务已 ...
- [转]javascript之Object.assign()痛点
本文转自:http://blog.csdn.net/waiterwaiter/article/details/50267787 最近也一直会用javascript,然后中间使用的一些组件,如Echar ...
- java基础之基础语法详录
[前言] java的语法先从基础语法学,Java语言是由类和对象组成的,其对象和类又是由方法和变量组成,而方法,又包含了语句和表达式. 对象:(几乎)一切都是对象,比如:一只熊猫,他的外观,颜色,他在 ...
- 922-按奇偶校验排序数组II
给定一组A 非负整数,A中的一半整数是奇数,而整数的一半是偶数. 对数组进行排序,以便每当A[i]奇数时,i都是奇数; 无论何时A[i]均匀,i均匀. 您可以返回满足此条件的任何答案数组. 例1: 输 ...
- VSCode环境
PythonPython for VSCode Language Support for Java(TM) by Red HatJava Language SupportJava DebuggerJa ...
- 应用Python处理空间关系数据
from osgeo import ogrimport jsonfrom geojson import loads, dumps, Feature, FeatureCollectionfrom sha ...
- FineReport中如何用JavaScript自定义地图标签
在日常使用地图过程中,通常会遇到地图标签,提示点等显示不满足我们的需求,需要进行JavaScript代码编写. 例如:在使用地图过程中,会发现很多地名显示的位置偏离.这时候就需要使用JavaScrip ...
- PyQt4（简单信号槽）
import sys from PyQt4 import QtCore, QtGui class myWidget(QtGui.QWidget): def __init__(self): super( ...
- Android组件系列----Activity的生命周期
[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/3 ...