编写的目的:

  进大厂往往需要扎实的基本,虽然html、css每天都用,但是C、V大法用久了,对基础的概念就越来越模糊了,so,写博客认真回顾基础。作为一名程序媛,可能聪明与理解深度比不上程序猿,so,用女生的细腻和扎实迎头赶上,缩小差距。

1、什么是HTML

    HTML是超文本标记语言,是标记语言,不是编程语言,它描述网页的语义,而不控制样式。

  eg.  <h1>什么是HTML</h1>  表示的就 “什么是HTML” 是一个标题  。 <p>HTML是超文本标记语言</p>  表示的就是  “HTML是超文本标记语言”  是一个段落。

 相关小概念:

双标签:开始标签(开放标签)、结束标签(闭合标签)。
单标签:只有开始标签
html对大小写不敏感,但是w3c推荐用小写,xhtm强制用小写。

2、HTML、XHTML、HTML5

    XHTML比HTML和HTML5更加严格,eg. XHTML要求用小写,必须有闭合标签;HTML和HTML5的要求比较宽松,HTML5比HTML内容更丰富。

3、HTML的基本框架

浏览器渲染的内容是 body中的。

<html>
  <head>
    <meta charset = "utf-8">
    <title></title>
  <head>
  <body>
  </body>
</html>

 

4、DTD(文档类型定义)

在文档的首行,需要定义文档的类型,告诉浏览器,这是一个HTML文档。

H5在文档开头:<!DOCTYPE html>

不同版本的html和xhtml的写法有不同,但是H5的写法是向下兼容的,so,可以直接用H5的写法。

<!DOCTYPE html>
<html>
.....
</html>

5、编码格式

在head头结点内,meta标签中,我们申明文档的编码格式,浏览器会按照这个格式来解析。一般的格式 GB2312、GBK、UTF-8

GB2312、GBK : 国标,只有中文和常用英文的编码。体积小

UTF-8 : 所有编(是一种针对Unicode的可变长度字符编码,又称万国码),体积大,但是网速飞起的今天,这点量,带来的影响可以忽略了,so,绝大多数情况下用UTF-8。

<meta charset="utf-8" >

 

注意:meta 标签申明的是 解析编码的格式,如果我们文档保存格式是GBK,meta 申明的是 UTF-8 ,那打开网页,会出现乱码的。 需要保存的编码格式和申明的格式一致。

如,我用记事本保存如下代码,且代码格式是utf-8,点击文件,可以正常显示。

<!DOCTYPE html>
<html>
  <head>
        <meta charset="UTF-8" >
    <title>我是标题</title>
  </head>
  <body>
        hello 中国
  </body>

</html>

正常显示的网页。

 

接着,我将   <meta charset="UTF-8" >  改为  <meta charset="GBK" > 再点保存。

再打开文件,乱码。

6、开发工具

前端开发可以直接用记事本、notepad++等文本 编辑器。但是用文本编辑器开始时不太友好,没有提示。建议用WebStorm 

官网:https://www.jetbrains.com/webstorm/