1.下载安装 vscode, chrome
下载安装 vscode
- 下载地址:https://code.visualstudio.com/
- 安装插件:
chinese(simplified …): 简体中文语言包
live server: 实时预览插件
prettiercode formatter: 代码格式化插件(老师推荐)
helium icon theme: 一款文件图标主题(老师推荐)
vscode 主题图标网站:https://vscodethemes.com/
插件配置:管理-设置/文件-设置/快捷键 Ctrl+,
markdown preview…: markdown 实时预览
markdownlint: markdown 语法检查器
下载安装谷歌 chrome 浏览器
2.学会使用 chrome 检查器/开发者工作,查看 html 页面结构
页面结构
- 用户界面(view):html/css/js/vue…
- 业务逻辑(controller):php/java/go/python…
数据(model):mysql/mssql…
打开网页,右键-检查 可以查看页面结构
<!DOCTYPE html>
<html lang="zh-CN">
<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></body>
</html>