[HTML]初识HTML5

<!--HTML5 大多以<xxxx></xxxx>的形式存在-->
<!DOCTYPE html>  <!--HTML5 文档-->
<html><!-- 页面的根元素-->
    <head><!-- 页面的头,或者可以理解为一些属性-->
		<meta charset="utf-8"><!--网页编码格式为 utf-8-->
		<title>测试</title>
		<base href="./images/" target="_blank"><!--描述了基本的链接地址/链接目标-->
		<link rel="stylesheet" type="text/css" href="./css/style.css"><!--链接css目标-->
		<meta name="PangCoder" content="Learn HTML"><!--定义网页的一些信息-->
		<meta http-equiv="refresh" content="30"><!--30s刷新网页-->
	</head>
	
    <body>
		<!--h1 大标题,共有<h1> ... <h6>  -->
		<!--align 设置对其方式,align="value" -->
		<!--align="left" ,左对齐内容(默认值)-->
		<!--align="right" ,右对齐内容-->
		<!--align="center" ,居中对齐内容-->
		<!--align="justify" ,对行进行伸展,这样每行都可以有相等的长度-->
        <h1 align="center">这是第一个大标题,它的标识是h1,我使用了align="center"来使它居中</h1>
		
		<!--p 段落,在段落中我们还可以调整一些效果 -->
        <p align="left">这是第一个段落,它的标识是p,我使用了align="left"来使它开头在左侧</p>
		<!--下列在段落中使用的标识也可以单独拿出来使用 -->
		<!--p 段落,b 粗体文本 -->
		<p>这是普通文本 - <b>这是粗体文本</b>。</p>
		<b>这也是粗体文本</b>
		<!--p 段落,i 斜体文本 -->
		<p>这是普通文本 - <i>这是斜体文本</i>。</p>
		<!--p 段落,small 小号字 -->
		<p>这是普通文本 - <small>这是小号字</small>。</p>
		<!--p 段落,strong 加重文本(和b基本一致,为了适应不同的标签) -->
		<p>这是普通文本 - <strong>这是加重文本</strong>。</p>
		<!--p 段落,sub 下标字 -->
		<p>这是普通文本 - <sub>这是下标字</sub>。</p>
		<!--p 段落,sup 上标字 -->
		<p>这是普通文本 - <sup>这是上标字</sup>。</p>
		<!--p 段落,ins 插入字 -->
		<p>这是普通文本 - <ins>这是插入字</ins>。</p>
		<!--p 段落,del 删除字 -->
		<p>这是普通文本 - <del>这是删除字</del>。</p>
		
		<!--hr 用于绘制一条水平线,用于分隔内容-->
		<hr>
		
		<!--br 标识用于换行 ,中间文字可以添加或者省略-->
		<br>链接</br>
		
		<!--<a> 标签中必须提供 href 属性或 name 属性 -->
		<!--<a> 属性值本身就含有双引号,那么您必须使用单引号 -->
		<!--href 属性用于指定超链接目标的 URL -->
		<a href="http://www.pangcoder.cn">这个是一个网页链接,它的标识是a</a>
		
		<br>
		
        <!--target 点击链接后的新窗口打开链接-->
		<a href="http://www.pangcoder.cn" target="_self">当前窗口打开链接(默认)</a>
		<br>
		<a href="http://www.pangcoder.cn" target="_blank">新窗口打开链接</a>
		<br>
		<a href="http://www.pangcoder.cn" target="_parent">父框架打开链接</a>
		<br>
		<a href="http://www.pangcoder.cn" target="top">窗口主体打开链接</a>
		
		<!--hr 用于绘制一条水平线,用于分隔内容-->
		<hr>
		<!--多行分割-->
		<p>这个段落<br>演示了<br>分行的效果</p>
		
        <!--加载图片,使用img标识-->
		<img loading="lazy" src="An.jpg" width="227" height="230" />
	</body>
</html>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值