JavaWeb课程笔记2 HTML中的基础标签

最新推荐文章于 2024-07-20 18:10:58 发布

Li Yuexi

最新推荐文章于 2024-07-20 18:10:58 发布

阅读量110

点赞数

文章标签： html 前端 css

本文链接：https://blog.csdn.net/verssqsq2089/article/details/122749312

版权

HTML中的基础标签

学习HTML，首先需要掌握HTML的基础标签，下面为各种标签代码演示及其讲解。

<html>
	<head>
		<title>HELLO</title>
		<meta charset="UTF-8">
	</head>
	<body>
		HELLO WORLD！
		你好，HTML！
		<p>这里是第一个段落</p>
		<p>这里是第二个段落</p>
		<img src="imgs/timg.jpg" width="57" height="73" alt="这里是一张图片" />
		<h1>标题一</h1>
		<h2>标题二</h2>
		<h3>标题三</h3>
		<h4>标题四</h4>
		<h5>标题五</h5>
		<h6>标题六</h6>
		武林高手排行榜：
		<ol type="A" start="3">
			<li>扫地僧</li>
			<li>萧远山</li>
			<li>慕容博</li>
			<li>虚竹</li>
		</ol>
		武林大会人员名单:
		<ul type="square">
			<li>乔峰</li>
			<li>阿朱</li>
			<li>马夫人</li>
			<li>白世镜</li>

		</ul>
		你是喜欢<b>甜</b>月饼还是<i>咸</i><u>月饼</u>？
		<br/>
		水分子的化学式: H<sub>2</sub>0 <br/>

		氧气的化学式 O<sup>2</sup><br/>
		5&lt;10
		10&gt;5
		5&le;10
		10&ge;5
		注册商标 &reg;
		版权符号 &copy;

		<span>赵又廷</span>，夺妻之仇
		<a href="http://www.baidu.com" target="_blank">百度一下</a>
		
	</body>
</html>

<!--
	1)
	html语言是解释性语言，而不是编译性语言
	浏览器是容错的
	2)
	html页面中由一对标签组成：<html></html>
	<html>称之为开始标签
	</html>称之为结束标签
	3)
	title 表示网页的标题
	4)
	可以在meta标签中设置编码方式
	5)
	<br/>表示换行，br标签是一个单标签，单标签:开始标签和结束标签是同一个，斜杆放在单词后
	6)
	p表示段落标签
	7)
	img标签 图片标签
		src属性表示图片文件的路径
		width和height表示图片的大小
		alt表示图片的提示
	8)
	路径的问题：
	1.相对路径
	2.绝对路径
	9)
	h1~h6:标题标签
	10)
	列表标签：
	ol 有序列表
	start表示从*开始，type显示的类型:A a I i 1(default)
	ul 无序列表
	type disc(default),circle,square
	11) 
	u 下划线 b 粗体 i 斜体 
	12)
	上标 sup 下标 sub
	13)
	HTML中的实体：小于号 &lt; 大于等于号 &ge; 版权 &copy;
	14)
	span不换行的块标记
	15)
	a表示超链接
		href 链接的地址
		target:
			_self 在本窗口打开
			_blank 在一个新窗口打开
			_parent 在父窗口打开
			_top 在顶层窗口打开
	16）
	div层


-->

效果

网页效果1

父窗口与顶层窗口的图解演示

父窗口和顶层窗口

div标签演示代码

<html>
	<head>
		<title>HELLO</title>
		<meta charset="UTF-8">
		<style type="text/css">
			div{
				width:200px;
				height:200px;
				position: absolute;
			}
			#div1{
				background-color:#ABC; 
			}
			#div2{
				background-color:#8BC; 
				left:100px;
				top:100px;
			}
			#div3{
				background-color:#FF8; 
				left:200px;
				top:200px;
			}
		</style>
	</head>
	<body>
		<div id="div1">div1</div>
		<div id="div2">div2</div>
		<div id="div3">div3</div>
	</body>
</html>

效果

网页效果

Li Yuexi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaWeb课程笔记2 HTML中的基础标签

HTML中的基础标签学习HTML，首先需要掌握HTML的基础标签，下面为各种标签代码演示及其讲解。<html> <head> <title>HELLO</title> <meta charset="UTF-8"> </head> <body> HELLO WORLD！你好，HTML！ <p>这里是第一个段落</p> <p>这里是第二个段落</p&g
复制链接

扫一扫