HTML常用标签

最新推荐文章于 2024-09-09 22:16:15 发布

萝卜的程序媛日记

最新推荐文章于 2024-09-09 22:16:15 发布

阅读量100

点赞数

分类专栏： JavaWeb 文章标签： html css servlet

本文链接：https://blog.csdn.net/wohehel/article/details/127194383

版权

JavaWeb 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

HTML常用标签

内联框架

块元素与内联元素

HTML常用标签

<head>标签用来表示网页的元数据，head中包含了浏览器和搜索引擎使用的其他不可见信息。

使用meta可以用来做请求的重定向： <meta http-equiv="refresh" content="秒数;url=目标路径" />

<meta charset="utf-8" />
<meta name="keywords" content="HTML5,JavaScript,前端,Java" />
<meta name="description" content="发布h5、js等前端相关的信息" />
<meta http-equiv="refresh" content="5;url=http://www.baidu.com" />

<title>标签表示网页的标题，一般会在网页的标题栏上显示。

<body>标签用来设置网页的主体，所有在页面中能看到的内容都应该编写到body标签中。

<html>
	<head>
		<title>这是一个非常好的网页</title>
	</head>

	<body>
		<h1>这是我的第一个网页</h1>
	</body>
</html>

div标签是块级元素，拥有块级元素的特点。每对div标签（<div></div>）里的内容都可以占据一行，不会其他标签在一行显示；div标签总是从新行开始显示；
且div标签可以通过css样式来设置自身的宽度（也可省略，当没有使用css自定义宽度时，div标签的宽度为其的容器的100%）、高度，且还可以设置标签之间的距离（外边距和内边距）；

我们还可以在div标签中，使用其他标签（行内元素、块级元素都行），比如：span标签，p标签，也可以是div标签。
span标签是行内元素，拥有行内元素的特点。span标签元素会和其他标签元素会在一行显示（块级元素除外），不会另起一行显示。span标签的宽度、高度都无法通过css样式设置，它的宽高受其本身内容（文字、图片）控制，随着内容的宽高改变而改变；span标签无法控制外边距和内边距，虽然可以设置左右的外边距和内边距，但上下的外边距和内边距无法设置。span标签里只能容纳文本或者是其他的行内元素，不能容纳块级元素。
h1~h6都是网页中的标题标签，用来表示网页中的一个标题，不同的是，从h1~h6重要性越来越低。
p标签表示网页中的一个段落。一般浏览器会在段落的前和后各加上一个换行，也就是段落会在页面中自成一行。
br标签表示一个换行标签，使用br标签可以使br标签后的内容另起一行。
hr标签是水平线标签，使用hr标签可以在页面中打印一条水平线，水平线可以将页面分成上下两个部分。
a标签是超链接标签，通过a标签，可以快速跳转到其他页面。href 指向一个链接地址，target 设置打开目标页面的位置，可选值：_blank新窗口、 _self当前窗口
使用img标签来向网页中引入一个外部图片，img标签也是一个自结束标签

属性：

src：设置一个外部图片的路径，src属性配置的是图片的路径，目前我们所要使用的路径全都是相对路径。可以使用../来返回一级目录,返回几级目录就写几个../

alt：可以用来设置在图片不能显示时，对图片的描述

搜索引擎可以通过alt属性来识别不同的图片

如果不写alt属性，则搜索引擎不会对img中的图片进行收录

width：可以用来修改图片的宽度,一般使用px作为单位

height ：可以用来修改图片的高度，一般使用px作为单位

宽度和高度两个属性如果指设置一个，另一个也会同时等比例调整大小

如果两个值同时指定则按照你指定的值来设置

一般开发中除了自适应的页面，不建议设置width和height

<head>
		<!-- 需要来告诉浏览器，网页所采用的编码字符集
			meta标签用来设置网页的一些元数据，比如网页的字符集，关键字、简介
			meta是一个自结束标签，编写一个自结束标签时，可以在开始标签中添加 一个/
		-->
		<meta charset="utf-8" />
		<title>网页的标题</title>
	</head>

<body>
		<!-- 
			在HTML中，一些如< >这种特殊字符是不能直接使用，
				需要使用一些特殊的符号来表示这些特殊字符，这些特殊符号我们称为实体（转义字符串）
				浏览器解析到实体时，会自动将实体转换为其对应的字符
			实体的语法：
				&实体的名字;
					<  &lt;
					>  &gt;
					空格  &nbsp;
					版权符号 &copy;
		-->
		a&lt;b&gt;c
		<p>&copy;&divide;今天天气&nbsp;&nbsp;&nbsp;好晴朗，处处好风光</p>
	</body>

内联框架

<!-- 
			使用内联框架可以引入一个外部的页面
				使用iframe来创建一个内联框架
				属性：
					src ：指向一个外部页面的路径，可以使用相对路径
					width：
					height：
					name ：可以为内联框架指定一个name属性
					
			在现实开发中不推荐使用内联框架，因为内联框架中的内容不会被搜索引擎所检索		
		-->
		<iframe src="demo02.html" name="tom"></iframe>