HTML 入门

淩亂°似流年 2022-07-15 00:14 136阅读 0赞

**1、什么是HTML**  
      HTML(Hyper Text Markup Language),超级文本标记语言  
      超文本:  a   
      标记 : 超文本都是由标记组成的<a>  
      语言 : 包含自己独特的语法  
      HTML最终由浏览器负责解释  
      HTML总可以嵌入一些脚本语言编写的程序段:Javascript,VBScript  
**2、HTML版本**  
      超级文本标记语言（第一版） HTML2.0 HTML3.2 HTML4.0 HTML4.01 XHTML1.0 HTML5

**3、文档结构**

1、文档类型声明  
      声明使用的html版本和风格  <!doctype html>  
   2、html页面  
      1）文档根元素  
         每个文档有且仅有一对根元素 , html  
      2）在根元素的内部，包含两对子元素  
           1⃣️head : 页面的头部内容  
          定义页面全局信息  
  包含:  
    <title></title> : 网页标题  
    <meta />:声明元数据(编码,关键字,描述)  
    <style></style>:声明内部样式表  
    <link />:引入外部样式表  
    <script></script>:定义或引入脚本文件  
          2⃣️body : 页面的主体内容  
          任何一个标签，都可能会出现在body中    
      3）head元素  
         1⃣️声明网页标题  
   <title></title>  
  2⃣️定义网页文本编码格式  
     
   默认:ISO-8859-1,只支持英文以及英文状态下的标点符号  
   utf-8:支持中英文,标点符号  
   <meta charset="utf-8" />  
      4）body元素  
         属性:  
   text : 文本的颜色

bgcolor : 背景颜色

**4、文本标记**

1）特殊的文本  
      转义字符：  
      空格:&nbsp;  
      < : < less than  
      > : >  greater than  
      版权标识:&copy;  
   2）文本标记  
      1⃣️文本样式  
         <b>...</b> : 加粗文本  <i>...</i> : 斜体文本 <u>...</u> : 下划线 <s>...</s> : 删除线 <sup>...</sup> : 上标  <sub>...</sub> : 下标  
      2⃣️标题元素  
         1-6级6个标题 <hn></hn>  n:1-6  
一级最大  六级最小  
      3⃣️段落元素  
         提供了结构化文本的表现方式  
语法:<p></p>  
注意：  
   1、每对p标签单独成一个段落  2、段落与其他元素有垂直空白，段落间距  
常用属性:   
   align : 水平对齐方式  取值:left center right  
       4⃣️换行元素  
         在代码的任何位置处，实现回车的效果 <br />  
       5⃣️水平线  
         又叫分割线  
<hr />  
 属性:  
  1、size : 水平线的粗细，通常以像素(px)为单位  
  2、width: 宽度  
  3、align: 水平线的水平对齐方式  
  4、color: 颜色  
        6⃣️分区元素  
         目的：为元素进行分组，多数用在布局中  
块分区元素:<div></div> 层  
行内分区元素:<span></span>  
注意：  
  div ：主要用在布局上  
  span：修改其内部内容的样式  
        7⃣️预格式化  
         保留源文档中的空格和回车  
<pre>  
文本内容  
</pre>  
   3）注释  
      可以写在html源码中，但不被浏览器解释的文本  
      语法:  
          
   4）行内元素与块级元素  
      块级元素:默认情况下，块级元素独占一行，元素的前后都会自动换行 div,hn,hr,p  
      块级元素作用:布局  
      行内元素:默认情况，多个元素位于同一行，不会换行  
         span,文本标记... ...  
      行内元素作用:修改内部内容的样式