02
HTML CSS 是做网站的编程语言
浏览器解析代码后成为看到的网站，鼠标右键可查看网页源代码
一个网站是由多个网页组成，每一个网页一个.HTML文件
创建.HTML 文件：(新建文本文档.TXT) 重命名为demo.html
双击在浏览器中打开查看效果
03
宇宙第一编辑器VS CODE
VS CODE ，全称Visual Studio Code 来自微软，是一个开源的、基于Electron的轻量代码编辑器。https://code.visualstudio.com
改中文:左侧最后一个扩展，搜索chinese安装。安装open in browser view in browser
ctrl+s:保存
ctrl+a:全选
ctrl+x,ctrl+c,ctrl+v :剪切，复制，粘贴
ctrl+z,ctrl+y:撤销，前进
shift+end:从头选中一行
shift+home:从尾部选中一行
shift+alt+下箭头：快速复制一行
alt+上箭头或下箭头：快速移动一行
tab:向后缩进
tab+shift:向前缩进
04
多光标：alt+鼠标左键
ctrl+d:选择相同元素的下一个
05
深入了解网站开发
UI设计师
web前端开发工程师（hs开发）
设计稿》》》代码 数据》》》显示到页面
html+css
html:结构 css:样式
web后端开发工程师
06
web前端的三大核心技术
HTML：结构
CSS：样式
JAVASCRIPT：行为
祛Java：
1：打开谷歌浏览器
2：点击设置
3：设置中找到高级，高级中找到内容设置，里面有一个Javascript
07
HTML基础结构与属性
超文本标记语言（hyper text markup laguage)，
语言：编程语言
超文本：文本内容+非文本内容（图片，视频，音频）
标记也叫标签：<header><footer>
写法分成两种
单标签<header>
双标签<header></header>
创建标签的快捷键：单词+tab>
标签可以上下排列，也可以组合嵌套
常见html标签：
标签的属性：来修饰标签的，设置当前标签的一下些功能。
<标签 属性=“值” 属性2=“值2”>
08
HTML初始代码：每个.html文件都有的代码
！+tab快捷键
<!DOCTYPE html> 文档声明：告诉浏览器这是一个html文件
<html lang="en"> html 文件的最外层标签:包裹所有html的标签代码 lang="en"表示一个英文的网站 lang="zh-CN"表示一个中文的网站
<head>
<meta charset="UTF-8"> 元信息：是编写网页中的一些赋值信息
<title>Document</title> 设置网页的标签
</head>
<body>
显示网页内容
</body>
</html>
09
HTML注释
写法：<!-- 注释的内容 --> 在浏览器中看不到，只能在代码中看到注释中的内容。
意义：
1把现在暂时用不到的代码注释起来，方便以后使用。
2对开发人员进行提示。
快捷添加注释与删除注释
1.ctrl+/
2shift+alt+a
10
HTML语义化
所谓HTML语义化指的是，根据网页中内容的结构，选择合适的HTML标签进行编写。
好处：
1.在没有CSS的情况下，页面也能呈现出很好的内容结构。
2.有利于SEO，让搜索引擎爬虫更好的理解网站。
3.方便其他设备解析（如屏幕阅读器，盲人阅读器等）。
4.便于团队的开发与维护。
11
标题与段落
标题》》》双标签：<h1></h1>
h1标题最重要，只能出现一个
12
强调 <strong>：双标签，会对文本进行加粗
<em>：会对文本进行斜体
下标：<sub></sub> H2O
上标：<sup></sup> A^2
<del>...<ins>:删除文本，插入文本
13
图片标签：img->单标签<img scr=" "alt=" “>
scr：引入图片的地址
alt：当图片出现问题时，可显示一段友好的文字。
title：提示信息
wide.height：图片大小
14
引入文件的地址路路径
1相对路径
.在路径中表示当前路径
..在路径中表示上一级路径
2绝对路径
15
链接跳转
<a>标签：a->双标签<a></a>
<a href=" "> </a>
href属性：链接的地址
target属性：可以改变链接打开的方式，默认情况下：在当前页面打开-self 新窗口打开-blank
<base>标签：改变默认行
16
跳转锚点
也是a标签<a href=" "> </a>
实现1
#号+id属性
实现2
#号+name属性
17
特殊符号
无法输入和空格字符都是特殊字符，在HTML中，为这些特殊字符准备了专门的代码
18
无序列表
<ul>.<li>：列表的最外层容器，列表项
ul和li必须是组合出现的，他们之间不能有其他标签的
type属性：改变前面标记的样式（一般都是CSS去控制)
19
<ol>,<li>：列表的最外层容器，列表项
有序用的少，经常用无序，无序列表可代替有序列表
20
定义列表
<dl>：定义列表
<dt>：定义专业术语或名词
<dd>：对 名词进行解释和描述
列表项需要添加标题和对标题进行描述的内容
扫一扫
7749
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
