前端与移动开发入门基础html完结版

置顶

Denisedan

已于 2022-02-11 16:44:11 修改

阅读量6.6k

点赞数 1

分类专栏： html 文章标签： html 前端基础

于 2019-07-15 17:25:03 首次发布

本文链接：https://blog.csdn.net/Denisedan/article/details/95673683

版权

本文介绍了前端与移动开发的基础知识，重点讲解了HTML的结构、标签、属性和常见用法，包括标题、段落、链接、图像、表单等，同时提到了Web标准和常见浏览器内核。

摘要由CSDN通过智能技术生成

前端与移动开发

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>