本文介绍了前端与移动开发的基础知识，重点讲解了HTML的结构、标签、属性和常见用法，包括标题、段落、链接、图像、表单等，同时提到了Web标准和常见浏览器内核。
前端与移动开发
PC端
主要是电脑端,主要是网页开发
移动端
泛指可移动的设备(手机 平板) 可以开发运行在移动端的页面 如手机app 小程序
认识WEB网页
网页主要由文字 图片 链接 音频 视频 动画等元素构成
软件的分类
- CS结构（clinet-Server）：QQ、360安全卫士、office，过段时间要升级一下，很多数据保存在本地，需要经常更新客户端。
- BS结构（浏览器-服务器）：只要是基于浏览器访问，例如京东、淘宝，BS端的程序，不需要更新，由服务器来完成软件的升级。
常见的浏览器及内核(了解)
- IE浏览器(内核trident)
- Edge浏览器(同ie)
- 谷歌浏览器(内核chromium/blink)
- Safari浏览器(内核webkit)
- 火狐浏览器(内核gecko)
web标准
由W3C组织和其他标准化组织制定的一系列标准的集合
W3C（万维网联盟）是国际最著名的标准化组织
通过web标准 让不同的浏览器 展示统一的内容
web标准的构成
html 结构层 负责整个网页元素的整理及分类
css 样式层 负责网页元素的版式 颜色 字体大小等外观样式
javascript 行为层 负责网页中的交互行为编写
程序员开发工具(IDE)
- sublime
- webstrom
- vscode
- HBuilder
HTML
hyper text markup language
超文本标签语言
只要带有尖括号的就是标签
vscode中插件安装
- 安装插件后需要重启软件，必须联网才能安装插件
- Chinese 中文（简体）
- open in browser 从默认浏览器中打开
- auto rename tag 自动修改标签名字
- Vetur 让vscode软件提高对vue的支持(比如高亮 图标…)
- Vue 2 snippets vue关键语法的提示
- css peek 追踪至样式
- js-css-html formatter 每次保存，都会自动格式化js css和html代码（不建议安装，不好用）
vscode快捷方式
- alt + shift + ↓ 快速赋值当前行到下一行的位置
- ctril + / 注释代码
- ctrl + 回车 快速另起一行
- alt + r 从默认浏览器中打开
- ctrl + z 撤销
(可以在键盘快捷方式搜索open in default browser 修改快捷方式) - ctrl+ + 放大字体
- ctrl+ －缩小字体
- 勾选自动保存
HTML固定结构代码
//当前的文档类型是html5
<!DOCTYPE html>
//html 顶级标签/根节点
//lang 当前的文档语言 en 英文 zh-CN 中文 fr 法文
<html lang = 'en'>
//头部标签 用来存储某些辅助型标签 如title base link等
<head>
<meta charset="UTF-8">
//字符集类型 万国码UTF-8 存储文字，不写会出现乱码
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>网页标题</title>
</head>
<body>
//网页的内容
</body>
</html>
快速搭建固定结构代码
!+tab(推荐)
html+tab
html:5+tab
三者选一
注意
记得文件添加后缀名.html
所有的代码符号都是英文标点符号
建议安装第三方输入法 我用的是搜狗
最低0.47元/天 解锁文章
1897
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
