基础知识

开发环境

浏览器使用chrome
开发工具使用vscode

chrome

chrome是google推出的市场占有率最高的浏览器。因为chrome是开源的所以我们用的很多国内浏览器都是基于 chrome开发的。

查看源码

通过查看其他网站源码有助于新手学习，同时有些 HTML 是后台脚本如 PHP 渲染出来的，通过查看源码可以帮助我们分析问题。

HTML

HTML 不是一种编程语言，而是一种标记语言 (markup language)，是网页制作所必备的。用于按不同标签声明网页中的内容。

通过下图我们可以看到，一个网页是由很多区域组合构成的，即使用 HTML 标签布局。

文件命名

使用小写字线命名文件，不要出现中文字符
扩展名标准是.html，当然也可以使用.htm
多个单词可以使用- 或 _ 连接，建议使用- 字符如user-create.html

URL

统一资源定位符，用于表示资源在网络上的地址，每个部分以/进行分隔。

http 资源访问

https://www.theliuwei.com/docs/html_demo.html

FTP 文件下载

ftp://ftp.theliuwei.com/download/index.pdf

MAILTO 邮箱地址

mailto:[email protected]

参数说明

参数	说明
https	访问协议 http 或 https、ftp、mailto
www.theliuwei.com	服务器地址
docs/	资源目录
html_demo.html	文件名

访问路径

绝对路径

绝对路径包含主机+服务器地址+目录+文件名的完整路径

https://www.theliuwei.com/docs/html_demo.html

相对路径

相对路径是指相对当前目录的地址

# 当前目录的文件
html_demo.html
# 上级目录中的文件
../html_demo.html
# 子目录中的文件
docs/html_demo.html
# 根目录中的文件
/bootstrap.html

注释

使用注释对一段 html 代码进行说明，方便自己或同事在未来清楚的明白代码意图。

html

<!-- 这是导航条 START -->
<header role="navigation">
  <nav>
    <ul>
      <li>
        <a href="">THELIUWEI首页</a>
      </li>
      <li>
        <a href="">系统课程</a>
      </li>
    </ul>
  </nav>
</header>
<!-- 这是导航条 END -->

基础知识 ​

开发环境 ​

chrome ​

HTML ​

文件命名 ​

URL ​

http 资源访问 ​

FTP 文件下载 ​

MAILTO 邮箱地址 ​

访问路径 ​

绝对路径 ​

相对路径 ​

注释 ​