ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

HTML基本语法

2021-07-13 20:31:57  阅读:221  来源: 互联网

标签:基本 标签 单元格 语法 整行 HTML 跳转 页面 属性


1. 基本语法:

a. 标签的分类:
	i. 双标签
		1) 含义:成对儿出现的标签,有开始,有结束
		2) 特点:
			a) 有开始有结束
			b) 标签名字需要放在尖角号里面
			c) 双标签结束标记必须带/
			d) 所有的属性和属性值都必须放在开始标签里面
			e) 标签名字和属性之间必须带空格
			f) 每一组属性和属性值结束后,也需要使用空格
			g) 标签里面的属性和属性值需要使用=链接
			h) 所有的属性都需要带引号
	ii. 单标签
		1) 含义:自己独立出现,没有结束标记
		2) 特点:
			a) 独立出现,没有结束
			b) 标签名字和属性之间需要带空格
			c) 属性和属性值之间使用等号链接
			d) 属性值需要带引号
			e) 单标签也放在尖角号里面

2. 特殊字符:

a. lorem:随机生成一段英文文本
b.    半角空格
c.    全角空格;这个空格能够代替一个文字的位置
d. <              &lt;
e. >              &gt;
f. &copy;     圈C   版权符号
g. &reg;        圈R   商标
h. &trade;     ™商标

3. img

a. src路径:
	i. 相对路径;
		1) 相对于某一个文件夹之间的关系,查找对应的图片/文件
		2) ./img/pic.png                ./=当前目录
		3) ../==返回上一级
	ii. 绝对路径
		1) 从某一个盘符地址开始,从互联网地址,网盘地址访问对应的图片
b. alt图片的描述:只有图片是破损文件时才会显示出来,会占页面空间
c. title="当鼠标放在对应的文本或者图片上面的时候提示文本",不占页面空间

4. 超链接标签:a

a. 作用
	i. 跳转:不同页面之间的跳转;相同页面中的,不同区域的跳转(锚点)
		1) 不同页面之间的跳转
		跳转地址想要访问互联网地址的话则需要携带互联网http协议,
		默认的跳转打开方式是在本页面中打开。
			a) target="目标链接打开方式"
			_self=====在本页面中打开
			_blank===在新的空白页面打开
			_parent==在父级框架打开
			_top=====顶部框架打开
		2) 相同页面之间的不同区域的跳转
			a) 使用a标签实现锚点效果
			b) 基本语法:
			<a href="#锚点的名字">文本</a>
			<div id="锚点的名字"></div>

5. 表格标签:

a. 表格的作用:用来展示数据信息的。后台管理系统经常使用
b. 表格的基本格式:
	<table width="value" height="value" border="value">
		<tr>
			<td></td>
			<td></td>
		</tr>
	</table>
	注:一个tr表示一行,一个td表示一列,一个单元格
	i. table的属性:
		1) border
		2) width:
			a) 取值可以是%为单位的数值,占屏幕的百分比
			b) 宽和高的单位如果为px为单位的数值,px单位可以省略
		3) height:
			a) 一般不可取%,因为body没有高度,是自适应的高度。不能直接设置高度,需要根据父元素是否有高决定。
		4) 背景颜色==整个表格的背景颜色
			a) bgcolor="red"
		5) 边框颜色
			a) bordercolor="颜色"
		6) 表格的水平对齐方式
			a) align="left/center/right"
		7) 调整单元格和单元格之间的间距
			a) cellspacing="0px"   是贴在一起,不是合并了,边框像素为2
		8) 调整单元格和内容之间的间距
			a) cellpadding="0px"
		• 表格特点:如果没有设置对应的单元格的宽度的话,里面文本数量一致,则会均分,但凡里面内容多一点都会被撑大
		9) 表格的外边框修饰
			a) frame:
				i) above:上边线
				ii) below:下边线
				iii) box/border:一圈的边框线
				iv) hsides:上下边框线   使用频率较高
				v) vsides:左右边框线
				vi) lhs:左边框线
				vii) rhs:右边框线
		10) 表格内部的边线修饰:
			a) rules
				i) cols====纵向的线
				ii) rows===横向的线                           经常使用
				iii) all=====所有的线(合并后的)         经常使用
				iv) none===取消里面的边线
	ii. tr的属性
		1) bgcolor: 设置一整行单元格的背景颜色
		2) height:   设置一整行单元格的高度
		3) align:      设置一整行单元格里面内容的水平对齐方式
		4) valign:     设置一整行单元格里面内容的垂直对齐方式
			top/bottom/middle
			默认情况下单元格内容是左侧垂直居中显示的
	iii. td的属性: 单元格的属性,主要是对单元格的修饰
		1) width:会影响单元格所在的一整行的宽度
		2) height:会影响单元格所在的一整行的高度
		3) bgcolor:只设置这一个单元格的背景颜色
		4) align:只设置这一个单元格里面的内容的水平对齐方式
		5) valign:只设置这一个单元格的垂直对齐方式
		6) 合并单元格
			a) 水平合并单元格:colspan="数值"
			b) 垂直合并单元格:rowspan="数值"
			c) 注意:一般不删除单元格,把单元格注释掉,防止混乱

标签:基本,标签,单元格,语法,整行,HTML,跳转,页面,属性
来源: https://www.cnblogs.com/Dqarden/p/15008280.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有