html案例

html实例

1.标签的组成

<html>
 <head>
  <title>标签的组成</title>
 <meta charset ="UTF-8">
    </head>
    <<body bgcolor ="red" text="blue">
     标签的组成
     <hr>

      html从入门到精通
      <hr>

      <h1>王永杰的第一课</h1>
      <hr>

      <h2>二级标签</h2>
      
      
      <h1>哈哈</h1>呵呵
      <hr>
      
      <span>嘿嘿</span>吼吼
    </body>
</html>

实例应用:在这里插入图片描述

2.实体标签的字符

<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
          图书:&lt;&lt;HTML从入口到精通&gt;&gt;
          <hr>
          北京&nbsp;&nbsp;&nbsp;上海&nbsp;&nbsp;&nbsp;&nbsp;广州
          <hr>
          在html中用&amp;lt;表示<小于号
          <hr>
          "HTML语言"或者 &quot;HTML语言 &quot;
          <hr>
          版权所有   &copy;2000-2020高焦培训
          <hr>

           &reg;
           &time;关闭符合
           &aMp;实体字符名称严格区分大小写,即大小写敏感
</body>
</html>>

实用案列:
在这里插入图片描述

3.常用标签01

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" href="">
</head>
<body>
	hello world
	<br>
	welcome to html!
	<p>
		HTML称为超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。 
	</p>
	
	<p>
		超文本是一种组织信息的方式,它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中,也可能是其他文件,或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接,为人们查找,检索信息提供方便。
	</p>
	<hr>
	<h1>一级标题</h1>
	<h2>二级标题</h2>
	<h3>四级标题</h3>
	<h6>六级标题</h6>
</body>
</html>

实用案列:

在这里插入图片描述
4.常用标签2

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<pre>
		HTML从入门到精通
		主讲:hector
	</pre>
	<hr>

	<div style="width: 400px;height:100px;background: red">导航部分</div>
	<div style="width: 400px;height:500px ;background: yellow">导航部分</div>
	<div style="width: 400px;height:100px ;background: blue">导航部分</div>

	iphone XR,不要8888,不要1888,只要<span style="font-size: 50px;color: red">98元</span>
</body>
</html>

实用案列:在这里插入图片描述

5.常用标签3

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<h3>2020年网络游戏排行榜</h3>
		<ol type="a" start=5>
		<li>吃鸡</li>
		<li>王者农药</li>
		<li>LOL</li>
		<li>WOW</li>
		</ol>
		<hr>
	<h3>可爱的同学们</h3>
	<ol type="circle">
		<li>张三</li>
		<li>李四</li>
		<li>小五</li>
		<li>小六</li>
	</ol>	
	<hr>

	<h3>术语的解释</h3>
	<dl>
		<dt>LOL</dt>
		<dd>它是腾讯公司代理的一款游戏,中文名称叫英雄联盟</dd>
		<dd>可以分为PC端和移动端</dd>
		<dt>HTML</dt>
		<dd>是一种用来制作网页的标记语言</dd>
		<dt>JAVA</dt>
		<dd>是一种跨平台编程语言</dd>
	</dl>
</body>
</html>

使用案例:在这里插入图片描述

6.常用标签4

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Document</title>

</head>
<body>
	<hr color="#FF7300">
	<hr size="8px" color="green">
	<hr color="red" width="400px">
	<hr color="yellow" width="50%" size=10>
	<div style="width: 600px;height: 300px;background: #cccccc">
		<hr color="red" width="50%" align="right">
	</div>
</body>
</html>

实用案例:在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值