html基本标签_hlmt基本标签-CSDN博客

本文链接：https://blog.csdn.net/Clown_pan/article/details/94209700

1、html是是一种弱语言，就是哪怕代码有错误或者是不严谨的地方也会运行
（1）强类型定义语言：强制数据类型定义的语言。也就是说，一旦一个变量被指定了某个数据类型，如果不经过强制转换，就永远是这个数据类型。不会有改变。除非后面经过强制转换。

（2）弱类型定义语言：数据类型可以被忽略的语言。它与强类型定义语言相反, 一个变量可以赋不同数据类型的值。

强类型定义语言在速度上可能略逊色于弱类型定义语言，但是强类型定义语言带来的严谨性能够有效的避免许多错误。
2、html的标签及其常用的几种属性
（1）<body></body>

bgcolor：背景颜色，一般的编译器都有各种颜色提示，直接选择。
text：文本颜色，后面接的都是颜色类型.中间用“=”连接

（2）<h1></h1>标题标记标签，这里是用于控制标题大小的文件 1~6依次变小
注意：h标签大小和浏览器一行大小是一样的。并且标签是自带换行功能的，如果在HBuilder里面编辑的自己换行编辑到浏览器是不会换行的。
align="位置"属性就是位置是“left right center”用于将文字居中还是左边还是右边，默认值是left

（3）<font></font>用于字体的编辑
属性有：
color：颜色
face：字体
size：后面是数字。如70

（4）<p></p>：段落级标签，里面编辑的有换行功能
（5）<br>仅仅提供换行效果
（6）<div></div>：块级标签，提供换行效果，里面可以放各种标签。
属性有：
align：用于定义位置
name：用于区分名称
（7）<hr/>：分割线标签，默认带阴影。高度默认2px，
属性：
size：可以设置高度
width：宽度
heigth：高度
align：默认值是居中
color：颜色，默认透明，可以换颜色。
(8）<address></address>：地址标签
(9）<sup>上标例如 m²在html表示为m<sup>2</sup>
(10)<sub>下标例如 H₂O的表示形式为H<sub>2</sub>O
(11）<code>：代码标签
（12）<ol></ol>有序标签
type属性用于指明每一部分前面是什么格式的序号符start说明开始的序号是多少
对于type有如下几种格式：
在这里插入图片描述
其中1是每一个行开始的数字就是1 2 3
a就是从a ,b,c作为计数形势
同理后面的三种格式
(13)<ul></ul>无序标签
type:指明每一列列表前面的符号形式，其中type="square"表示实心图标，type="circle"表示空心圆

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>标签</title>
	</head>
	<body>
		<ol type="1" start="2">
			<li type="A">
				离离原上草
			</li>
			<li>
				一岁一枯荣
			</li>
			<li>
				野火烧不尽
			</li>
			<li>
				春风吹又生
			</li>
			
		</ol>
		
		
		
		<ul type="square">
			<li type="circle">
				离离原上草
			</li>
			<li>
				一岁一枯荣
			</li>
			<li>
				野火烧不尽
			</li>
			<li>
				春风吹又生
			</li>
			
		</ul>
	</body>
</html>

效果如下：
在这里插入图片描述
（14）<li></li>用于表示每一个标签内部的内容，可以嵌套在有序无序标签内部
（15）<a></a>用于网页链接的存放，其重要属性href后面接属性，例如可以在网页中跳转到其他网站的连接使用<a href="http://www.baidu.com">百度</a>
对于长篇的网页，一键定位到网页底部或者是网页首部实现主要用

<a href="#top">回到顶部</a>

其中所有标签的综合应用如下：


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表格和图片</title>
	</head>
	<body>
		<p>这是顶部</p>
		<ol type="i" start="2">
			<li type="A">
				离离原上草
			</li>
			<li>
				一岁一枯荣
			</li>
			<li>
				野火烧不尽
			</li>
			<li>
				春风吹又生
			</li>
			
		</ol>
		
		
		
		<ul type="square">
			<li type="circle">
				离离原上草
			</li>
			<li>
				一岁一枯荣
			</li>
			<li>
				野火烧不尽
			</li>
			<li>
				春风吹又生
			</li>
			
		</ul>
		<hr><!--[if IE]>
			
		<![endif]-->
		<img src="img/HBuilder.png"   alt"图片正在加载中"/>
		<img src="img/1.jpg"  height="120" weight="150"alt"图片正在加载中"/>
		
		<hr>
		<a href="http://www.baidu.com/">百度</a>
		<br>
		<a href="http://www.qq.com/">腾讯</a>
		<hr>
		<a href="img/1.jpg">点击查看大图</a>
		<hr>
		<a href="img/1.jpg">
			<img src="img/1.jpg"  height="300" weight="400"alt"图片正在加载中"/>
		</a>
		<hr>
		<a href="#top">回到顶部</a>
		<hr><!--[if IE]>
			
		<![endif]-->
		
	</body>
</html>

效果如下：
在这里插入图片描述