HTML(标题h、段落p、文本格式化、链接a、头部head)

 

HTML(标题h、段落p、文本格式化、链接a、头部head)

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 
  4 <head>
  5     <meta charset="UTF-8">
  6     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7     <!-- 定义了浏览器工具栏的标题 -->
  8     <title>HTML</title>
  9     <!-- <base> 标签描述了基本的链接地址/链接目标,
 10         该标签作为HTML文档中所有的链接标签的默认链接: -->
 11     <base href="#">
 12     <!-- link 定义了文档与外部资源的关系 -->
 13     <link rel="stylesheet" href="">
 14 </head>
 15 
 16 <body>
 17     <!-- 标题 (h1~h6)-->
 18     <h1>标题</h1>
 19     <h2>标题</h2>
 20     <h3>标题</h3>
 21     <h4>标题</h4>
 22     <h5>标题</h5>
 23     <h6>标题</h6>
 24 
 25     <!-- 段落标签 -->
 26     <p>我是一个段落</p>
 27     <p>另一个段落</p>
 28 
 29 
 30     <!-- 图片(重点) -->
 31     <!-- src放图片的位置/...(按文件夹所在的位置,
 32         如果不在与该.html文件同文件夹则用点"."返回到上一个文件夹) -->
 33     <!-- alt放图片不能显a示时代替的文字 -->
 34     <!-- <img src="tp/xxx.png" alt="狮子王,小鹿"> -->
 35     <!-- 在尖括号中可以设置图片的大小,边框 -->
 36     <!-- <img src="" alt="" width="10px" height="10px"> -->
 37     <!-- border 为图像设置边框 -->
 38     <img border="10px" src="tp/1.jpg" alt="" width="50px" height="37px">
 39  
49     <br>
50     <br>
40 <!-- 链接 ,‘#’放的是网址(重点)--> 41 <!-- target 内放弹出方式 self/blank self是默认值,blank是打开新的窗口 --> 42 <!-- 1. 如果当时没有确定链接目标时, 43 通常将链接标签的href属性值定义为“#”(即href="#"), 44 表示该链接暂时为一个空链接。 45 2. 不仅可以创建文本超链接, 46 在网页中各种网页元素, 47 如图像、表格、音频、视频等都可以添加超链接。 --> 48 51 <a href="#" target="">这是一个链接</a> 52 <br> 53 <!-- #1 链接是一个图片 --> 54 <a href="#"> 55 <img src="tp/1.jpg" alt="" width="50px" height="37px"> 56 </a> 57 <br> 58 <!-- #2在当前页面链接到指定位置 --> 59 <a href="#ab">跳转到123</a> 60 <br> 61 <div> <a id="ab">跳转到的地方</a></div> 62 <br> 63 64 65 <!-- 水平线标签 --> 66 <p> 67 我是一个水平线 68 <hr>标签啦啦啦 69 </p> 70 71 <!-- 换行标签 --> 72 <p> 73 我是一个 <br> 换行标签哈 <br> 哈哈哈哈哈哈哈哈 74 </p> 75 76 <!-- 文本格式化标签 --> 77 <p> 78 <b>这个文本是加粗的</b> 79 80 <br /> 81 82 <strong>这个文本是加粗的</strong> 83 84 <br /> 85 86 <big>这个文本字体放大</big> 87 88 <br /> 89 90 <em>这个文本是斜体的</em> 91 92 <br /> 93 94 <i>这个文本是斜体的</i> 95 96 <br /> 97 98 <small>这个文本是缩小的</small> 99 100 <br /> 这个文本包含 101 <sub>下标</sub> 102 103 <br /> 这个文本包含 104 <sup>上标</sup> 105 </p> 106 <p> 107 <!-- 删除del和插字ins效果 --> 108 我长得<del>帅哈哈哈</del> <ins>呜呜呜</ins>! 109 </p> 110 <p> 111 <!-- 显示方向 dir="rtl"(right to left 即从右到左。) 112 dir="ltr" (left to right 从左到右。)--> 113 <p>该段落文字从左到右显示。</p> 114 <p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p> 115 </p> 116 117 118 <!-- HTML链接 --> 119 120 121 </body> 122 123 </html>

标题

标题

标题

标题

标题
标题

我是一个段落

另一个段落


这是一个链接


跳转到123

跳转到的地方


我是一个水平线


标签啦啦啦

我是一个
换行标签哈
哈哈哈哈哈哈哈哈

这个文本是加粗的
这个文本是加粗的
这个文本字体放大
这个文本是斜体的
这个文本是斜体的
这个文本是缩小的
这个文本包含 下标
这个文本包含 上标

我长得帅哈哈哈 呜呜呜!

该段落文字从左到右显示。

该段落文字从右到左显示。

猜你喜欢

转载自www.cnblogs.com/CharlesBlog/p/12770756.html