html基本标签

<!DOCTYPE html>
<html>
      <!-- 头部 -->
<head>
    <!-- 开头的标题-->
    <title>  第一个题目  </title>

    <!-- 设置文件的字符集 -->
    <meta charset="UTF-8">

    <!-- 设置网页关键字 -->
    <meta name=" keywords" content="HTML,XXX,XXX,XXX>"
         <!--定义关键字时需要遵守以下几点:
         1、定义关键字之间,需要使用英文逗号隔开
         2、keywors 不是 keyword
         3、关键字是单词,而不是语句-->

    <!--可以使用description  对网页进行描述-->
    <meta name="description" content="这是对这个网页进行描述第一个网页">

    <!--meta  自动刷新本页面以及跳转到某一个页面上去-->
    <!-- 本网页每隔5秒自动刷新一次 -->
    <!--<meta http-equiv = "refresh"  content="5">-->
    <!--设置定时跳转-->
    <!--<meta http-equiv="refresh" content="5;https://www.baidu.com">-->
    <!--head 中还可以放置 style 、script 标签-->
</head>
       <!--主题标记body需要显示的网页模块定义在其中-->
      <body>
           <!--在 body 里面出现的内容:-->
           <!--1、注释:html中的注释格式:&lt;!&ndash;注释XXX内容&ndash;&gt;-->
           <!--2、文本信息:可以分为两大类:普通文本、一些特殊字符文本.-->
           <!--a:普通文本:汉子、英文或者在键盘上我们可以输出的字符.-->
           <!--b:特殊字符文本以&开头,使用;结束. -->
           <!--例如: 大小括号 .....-->
           <!--在html特殊字符文本有以下几点:-->
           <!--&ensp;  半大角的空格     一个代表半个汉子空格-->
           <!--&emsp;  全大角的空格     一个代表一个汉子空格-->
           <!--&nbsp;  不断行的空格空格 一个代表一个汉子空格-->
           <!--&gt;    大于符号        &lt;  小于符号-->
           <!--&ge;    大于等于符号    &le;    小于等于符号-->
           <!--&amp;   & 符号          &quot;  " 符号-->
           <!--&copy;  © 版权符号      &reg;   ◎ 注册商标符号-->
           <!--&times; 代表乘号符      &divide;代表除号符-->
           <!--在浏览器中,浏览器显示网页时,完全采用html标记来进行解释,会自动忽略多余的空格以及空行!-->
           <!--无论你输入多少空格,都只能识别一个空格,无论你输入多少空行,都直接自动被忽略;-->
           <!--如果要使用空格就使用&ensp;、&emsp;、&nbsp;   使用空行就使用 <br/>标签-->
           <!--主题元素<h1>--<h6>)从大到小字体,<h1>级别最高标题最重要其他的一次递减--<h6>级别最低-->
          <h1>主题1</h1>
          <h2>主题1</h2>
          <h3>主题1</h3>
          <h4>主题1</h4>
          <h5>主题1</h5>
          <h6>主题1</h6>

            <!--换行标签-->
           <br/>

           <!--p 标签 段落标签-->
          <p>段落</p>

           <!--加粗标签-->
          <b>加粗字体</b>       <strong>也是加粗字体</strong>

           <!--斜体字标签-->
          <em>斜字体</em>      <i>也是倾斜字体</i>

           <!--sup 上标签相当于平方;-->
          <p>4<sup>2</sup>&times;3<sup>2</sup></p>

           <!--sub 下标签 相当于化学成分二氧化氢的符号一样;-->
          <p>H<sub>2</sub>O</p>

           <!--用于定义文本分割线-->
          <hr/>

           <!--文本无序列表表示-->
          <h1>编程语言介绍</h1>
          <ul>
              <li>C语言</li>
              <li>Java语言
                  <lu>
                      <li>Java</li>
                      <li>Javascript</li>
                  </lu>
              </li>
              <li>C<sup>#</sup> (C xia pu)</li>
              <li>php</li>
              <li>.net</li>
          </ul>

           <!--文本有序列表-->
          <ol>
              <li>C语言</li>
              <li>Java语言
                  <ol>
                      <li>Java</li>
                      <li>Javascript</li>
                  </ol>
              </li>
              <li>C<sup>#</sup> (C xia pu)</li>
              <li>php</li>
              <li>.net</li>
          </ol>

           <!--HTML中,除了可以添加文字之外,还可以添加图片,当然添加图片,需要使用标记是.-->
           <!--在浏览器,可以支持的图片格式,非常的多: GIF, JPEG, BMP, PNG,TIFI-->
           <!--支持最多的是GIF,JPEG.-->
           <!--GIF最多只能使用256色的图像,图片大小都非常的小,下载速度比较块,帧数比较低. 它是采用多张帧数图片组合完成动画效果.-->
           <!--JPEG可以支持16M颜色,它展现的效果非常高清,但是它也支持压缩,但是它的压缩,是以牺牲图片的质量为代价,压缩月高,图片越模糊.-->
           <!--HTML在使用图片时,我们不是直接把图片存入到HTML中,而是在HTML中使用某些属性,指向图片所在目录位置-->
           <!--定位一个资源文件的路径,有两种方式:1、绝对路径, 2、相对路径-->
           <!--1、绝对路径,是以盘符为参照路径,来进行寻址-->
           <!--2、过路径,是以当前文件来作为参照路径,进行寻址-->
          <h3>显示图片的方式一:绝对路径</h3>
           <!--提升:在WebStorm 工具中 不支持这个绝对路径,但是用页面打开还是可以显示-->
           <!--下面属性 src :绝对路径地址 alt :进行图片描述(图片不显示时提示文字)  width :设置宽度  height :设置高度-->
           <!--也可以在有网的情况下,在绝对路径地址上面输入网站上面的图片地址也可以显示,但是推荐使用相对路径.-->
          <img src="D:html/img/1.jpg" alt="美丽的草原" width="300px" height="50px "/>

          <h3>显示图片的方式二:相对路径</h3>
           <!--以这个html文件来相对图片的位置来找这个路径.点点点...代表往上个文件找与img相同级的文件-->
          <img src=".../.../img/1.jpg" alt="美丽的草原" width="300px" height="50px "/>

           <!--address 通常用来描述个人信息.  a 为超链接. 点击后跳转到该页面 href :描述跳转的地址-->
          <address>
              联系人:某某某
              <br/>
              联系方式:XXXXXXXXXXX
              <br/>
              联系个人网站:<a href="http://www.w3school.com.cn">某某某</a>
          </address>
      </body>
</html>

如果不熟悉可以在工具里面自己尝试一下。便OK

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值