Browse Source

html基础标签

dongxiuling 1 năm trước cách đây
mục cha
commit
7f928da8ad
4 tập tin đã thay đổi với 75 bổ sung3 xóa
  1. BIN
      .DS_Store
  2. 1 0
      3_html语法.html
  3. 13 3
      5_圣诞老人.html
  4. 61 0
      6_基础标签2.html

BIN
.DS_Store


+ 1 - 0
3_html语法.html

@@ -58,6 +58,7 @@
     <a href="https://www.baidu.com">百度</a>
     <!-- <a href="真正跳转到的地址">跳转到哪的文字描述</a> -->
 
+    
 
 
 </body>

+ 13 - 3
5_圣诞老人.html

@@ -9,13 +9,23 @@
 <body>
     <h1>圣诞节的那些事</h1>
     1.圣诞是怎样由来的  <br>
-    <a href="">2.圣诞老人的由来</a>  <br>
-    <a href="">3.圣诞树的由来</a>    <br>
+    <!-- a标签跳转方式 锚点 -->
+    <a href="#shandan1">2.圣诞老人的由来</a>  <br>
+    <a href="#shandan2">3.圣诞树的由来</a>  <br>
 
     <h2>圣诞是怎样由来的</h2>
     <p>圣诞节是基督教世界最大的节日。一般认为12月25日作为圣诞节可能开始于公元336年的罗马教会。4世纪初,1月6日是罗马帝国东部各教会纪念耶稣降生和受洗的双重节日,即上帝通过耶稣向世人显示自己。 这一天又是罗马历书的冬至节,意味着万物复苏的开始。可能由于这个原因,罗马教会才选择这一天作为圣诞节。后来,因为各地教会使用的历书不同,具体日期不能统一,于是就把12月24日到第二年的1月6日定为圣诞节节期(Christmas Tide),各地教会可以根据当地具体情况在这段节期之内庆祝圣诞节。 在欧美许多国家里,人们非常重视这个节日,把它和新年连在一起,而庆祝活动之热闹与隆重大大超过了新年,成为一个全民的节日。12月24日平安夜、12月25日圣诞节的主要纪念活动都与耶稣降生的传说有关 。</p>
     
     <img src="./images/img01.gif" alt="">
-
+    <!-- 跳转到的位置标记id= "xxx" -->
+    <h2 id="shandan1">圣诞老人的由来</h2>
+    <p>圣诞节是基督教世界最大的节日。一般认为12月25日作为圣诞节可能开始于公元336年的罗马教会。4世纪初,1月6日是罗马帝国东部各教会纪念耶稣降生和受洗的双重节日,即上帝通过耶稣向世人显示自己。 这一天又是罗马历书的冬至节,意味着万物复苏的开始。可能由于这个原因,罗马教会才选择这一天作为圣诞节。后来,因为各地教会使用的历书不同,具体日期不能统一,于是就把12月24日到第二年的1月6日定为圣诞节节期(Christmas Tide),各地教会可以根据当地具体情况在这段节期之内庆祝圣诞节。 在欧美许多国家里,人们非常重视这个节日,把它和新年连在一起,而庆祝活动之热闹与隆重大大超过了新年,成为一个全民的节日。12月24日平安夜、12月25日圣诞节的主要纪念活动都与耶稣降生的传说有关 。</p>
+    
+    <img src="./images/img01.gif" alt="">
+    <h2 id="shandan2">圣诞树的由来</h2>
+    <p>圣诞节是基督教世界最大的节日。一般认为12月25日作为圣诞节可能开始于公元336年的罗马教会。4世纪初,1月6日是罗马帝国东部各教会纪念耶稣降生和受洗的双重节日,即上帝通过耶稣向世人显示自己。 这一天又是罗马历书的冬至节,意味着万物复苏的开始。可能由于这个原因,罗马教会才选择这一天作为圣诞节。后来,因为各地教会使用的历书不同,具体日期不能统一,于是就把12月24日到第二年的1月6日定为圣诞节节期(Christmas Tide),各地教会可以根据当地具体情况在这段节期之内庆祝圣诞节。 在欧美许多国家里,人们非常重视这个节日,把它和新年连在一起,而庆祝活动之热闹与隆重大大超过了新年,成为一个全民的节日。12月24日平安夜、12月25日圣诞节的主要纪念活动都与耶稣降生的传说有关 。</p>
+    
+    <img src="./images/img01.gif" alt="">
+    <br>
 </body>
 </html>

+ 61 - 0
6_基础标签2.html

@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <!-- 列表 -->
+    <!-- 无序列表 -->
+    <ul>
+        <li>HTML</li>
+        <li>CSS</li>
+        <li>Sass</li>
+    </ul>
+
+    <!-- 有序列表 -->
+    <ol>
+        <li>aaaa</li>
+        <li>bbbb</li>
+        <li>cccc</li>
+    </ol>
+
+
+    <!-- div标签 区块  一般用来布局  里边的文字内容没有任何样式-->
+    <div>我是一个<span style="color:red">DIV</span>我是一个DIV我是一个DIV我是一个DIV我是一个DIV我是一个DIV我是一个DIV</div>
+    <div>我是一个DIV<strong>我是</strong>一个DIV我是一个DIV我是一个DIV我是一个DIV我是一个DIV我是一个DIV</div>
+
+    <span>我是一个span</span>
+    <span>我是一个span</span>
+    <strong>普通的文本加粗</strong>
+    <b>加粗切重点</b>
+    <i>我要边倾斜</i>
+
+    <!-- div当成一个大的容器 span当成是一个小的容器 -->
+
+    <!-- 学习html中的标签 后发现
+    块级元素 :有的标签比较大,它会自己占一行 
+
+    行级元素 :标签比较小,多个占一个
+
+    标题:h1-h6
+    段落:p
+    图片:<img src="图片地址">
+    列表:
+    无序列表
+    <ul>
+        <li>1111</li>
+    </ul>
+    有序列表
+    <ol>
+        <li>1111</li>
+    </ol>
+
+    观察自己占一行还是多个站一行
+    div span  strong b 加粗 i 斜体
+    -->
+    
+</body>
+</html>