master #1
@ -28,7 +28,7 @@ Web（World Wide Web）即全球广域网，也称为万维网。
|
|||||||
|
|
||||||
### W3C组织
|
### W3C组织
|
||||||
|
|
||||||
**W3C**：万维网联盟组织，用来制定web标准的机构（组织）。
|
**W3C**：World Wide Web Consortium，万维网联盟组织，用来制定web标准的机构（组织）。
|
||||||
|
|
||||||
W3C 万维网联盟是国际最著名的标准化组织。1994年成立后，至今已发布近百项相关万维网的标准，对万维网发展做出了杰出的贡献。
|
W3C 万维网联盟是国际最著名的标准化组织。1994年成立后，至今已发布近百项相关万维网的标准，对万维网发展做出了杰出的贡献。
|
||||||
|
|
||||||
|
|||||||
@ -91,11 +91,13 @@
|
|||||||
|
|
||||||
参考链接：
|
参考链接：
|
||||||
|
|
||||||
- <https://www.2cto.com/kf/201202/118111.html>
|
- 英文版：[How Browsers Work: Behind the scenes of modern web browsers](https://www.html5rocks.com/en/tutorials/internals/howbrowserswork/)
|
||||||
|
|
||||||
|
- 中文版：[浏览器的工作原理：新式网络浏览器幕后揭秘](https://www.html5rocks.com/zh/tutorials/internals/howbrowserswork/)
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
本作品采用[知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议](https://creativecommons.org/licenses/by-nc-sa/4.0/)进行许可。
|
本作品采用[知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议](https://creativecommons.org/licenses/by-nc-sa/4.0/)进行许可。
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -258,7 +258,7 @@ XHTML1.0更为严格，因为这个体系本身规定比如标签必须是小写
|
|||||||
|
|
||||||
- zh-CN：定义页面语言为中文。
|
- zh-CN：定义页面语言为中文。
|
||||||
|
|
||||||
### 2、头标签 `head`
|
### 3、头标签 `head`
|
||||||
|
|
||||||
#### html5 的比较完整的骨架：
|
#### html5 的比较完整的骨架：
|
||||||
|
|
||||||
@ -374,7 +374,7 @@ title标签也是有助于SEO搜索引擎优化的。
|
|||||||
|
|
||||||
base 标签用于指定基础的路径。指定之后，所有的 a 链接都是以这个路径为基准。
|
base 标签用于指定基础的路径。指定之后，所有的 a 链接都是以这个路径为基准。
|
||||||
|
|
||||||
### 3、`<body>`标签
|
### 4、`<body>`标签
|
||||||
|
|
||||||
`<body>`标签的属性有：
|
`<body>`标签的属性有：
|
||||||
|
|
||||||
|
|||||||
@ -584,7 +584,7 @@ style="border-collapse:collapse;"
|
|||||||
- `action`：指定表单数据的处理程序，一般是PHP，如：action=“login.php”
|
- `action`：指定表单数据的处理程序，一般是PHP，如：action=“login.php”
|
||||||
- `method`：表单数据的提交方式，一般取值：get(默认)和post
|
- `method`：表单数据的提交方式，一般取值：get(默认)和post
|
||||||
|
|
||||||
注意：表单和表格嵌套时，是在<form>标记中套<table>标记。
|
注意：表单和表格嵌套时，是在`<form>`标记中套`<table>`标记。
|
||||||
|
|
||||||
form标签里面的action属性和method属性，在《Ajax》课程上给大家讲解。稍微说一下：action属性就是表示，表单将提交到哪里。 method属性表示用什么HTTP方法提交，有get、post两种。
|
form标签里面的action属性和method属性，在《Ajax》课程上给大家讲解。稍微说一下：action属性就是表示，表单将提交到哪里。 method属性表示用什么HTTP方法提交，有get、post两种。
|
||||||
|
|
||||||
|
|||||||
@ -68,7 +68,7 @@ a标签有4种伪类（即对应四种状态），要求背诵。如下：
|
|||||||
/*鼠标点击链接，但是不松手的时候*/
|
/*鼠标点击链接，但是不松手的时候*/
|
||||||
a:active{
|
a:active{
|
||||||
color:black;
|
color:black;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|||||||
@ -84,7 +84,7 @@ text-shadow 可以设置多个阴影，每个阴影之间使用逗号隔开。
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
上图中，实现凹凸文字效果的方式比较简单，给左上角放白色的阴影，右下角放黑色的阴影，就达到了凹下去的效果。
|
上图中，实现凹凸文字效果的方式比较简单，给左上角放黑色的阴影，右下角放白色的阴影，就达到了凹下去的效果。
|
||||||
|
|
||||||
|
|
||||||
## 盒模型中的 box-sizing 属性
|
## 盒模型中的 box-sizing 属性
|
||||||
|
|||||||
@ -122,7 +122,7 @@ person.height = '180';
|
|||||||
```js
|
```js
|
||||||
let a = 1;
|
let a = 1;
|
||||||
|
|
||||||
let b = a;// 将 b 赋值给 a
|
let b = a;// 将 a 赋值给 b
|
||||||
|
|
||||||
b = 2; // 修改 b 的值
|
b = 2; // 修改 b 的值
|
||||||
```
|
```
|
||||||
|
|||||||
@ -334,7 +334,7 @@ match()这个方法还是很实用的，可以在一个很长的字符串中，
|
|||||||
|
|
||||||
手机号的规则：
|
手机号的规则：
|
||||||
|
|
||||||
- 以1开头
|
- 以1开头（`^1` 表示1开头 , `[^1]`表示非1或除了1）
|
||||||
|
|
||||||
- 第二位是3~9之间任意数字
|
- 第二位是3~9之间任意数字
|
||||||
|
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
## JS 有哪些数据类型
|
## JS 有哪些数据类型
|
||||||
|
|
||||||
- 基本数据类型：string number bool undefined null
|
- 基本数据类型：string、number、bigint、bool、undefined、null
|
||||||
|
|
||||||
- 引用数据类型：object、symbol。
|
- 引用数据类型：object、symbol。
|
||||||
|
|
||||||
|
|||||||
88
README.md
88
README.md
@ -1,29 +1,52 @@
|
|||||||
|
|
||||||
前端入门到进阶图文教程，超详细的 Web 前端学习笔记。从零开始学前端，做一名精致优雅的前端工程师。
|
前端入门到进阶图文教程，超详细的 Web 前端学习笔记。从零开始学前端，做一名精致优雅的前端工程师。
|
||||||
|
|
||||||
## 项目地址
|
此前端教程长期免费，不玩猫腻，不会设置任何套路，暂时也没打算做成付费内容，因为我**相信启蒙的重要性**。
|
||||||
|
|
||||||
- GitHub地址：<https://github.com/qianguyihao/Web>
|
|
||||||
|
|
||||||
我的前端教程长期免费，不玩猫腻，不会设置任何套路，暂时也没打算做成付费内容，因为我**相信启蒙的重要性**。
|
|
||||||
|
|
||||||
如果你发现本项目有内容上的错误，欢迎在 GitHub 提交 issues 进行指正，**方便归档**。
|
|
||||||
|
|
||||||
由于 GitHub 是国外的网站，如果你发现网站访问较慢，或者文中的部分图片加载不出来，不妨[先看这里](https://github.com/qianguyihao/Web/issues/20#issue-390074432)。
|
|
||||||
|
|
||||||
## 项目介绍
|
## 项目介绍
|
||||||
|
|
||||||
前端入门到进阶图文教程。从零开始学前端，做一名精致的前端工程师。持续更新中。本项目的主要作用有：
|
**项目地址**：
|
||||||
|
|
||||||
- 1、网上的大部分入门教程，都不太适合初学者，本项目争取照顾到每一位前端入门者的同理心。即使你完全不懂前端，甚至不懂编程，通过这个教程，也能让小白入门。
|
- GitHub地址：<https://github.com/qianguyihao/Web>
|
||||||
|
|
||||||
- 2、帮助前端同学提供一个精品学习资源和路线，提高学习效率，少走很多弯路。
|
如果你发现本项目有内容上的错误，欢迎在 GitHub 提交 issues 或者 pull requests 进行指正，**方便归档**。
|
||||||
|
|
||||||
- 3、可以当做前端字典，随时翻阅，查漏补缺。
|
由于 GitHub 是国外的网站，如果你发现网站访问较慢，或者文中的部分图片加载不出来，不妨[先看这里](https://github.com/qianguyihao/Web/issues/20#issue-390074432)。
|
||||||
|
|
||||||
维护这个项目的初衷，可以看这篇文章：[《裸辞两个月，海投一个月，从Android转战Web前端的求职之路》](https://mp.weixin.qq.com/s/fr_NwtghRQagc_3ubk-hKQ)
|
**项目作用**：
|
||||||
|
|
||||||
前端入门路线和推荐学习资源，可以看这篇文章：[《2020年Web前端入门的自学路线》](https://www.cnblogs.com/qianguyihao/p/8776837.html)
|
- 网上的大部分入门教程，都不太适合初学者，本项目争取照顾到每一位前端入门者的同理心。即使你完全不懂前端，甚至不懂编程，通过这个教程，也能让小白入门。
|
||||||
|
|
||||||
|
- 帮助前端同学提供一个精品学习资源和路线，提高学习效率，少走很多弯路。
|
||||||
|
|
||||||
|
- 可以当做前端字典，随时翻阅，查漏补缺。
|
||||||
|
|
||||||
|
**其他链接**：
|
||||||
|
|
||||||
|
- 维护这个项目的初衷，可以看这篇文章：[《裸辞两个月，海投一个月，从Android转战Web前端的求职之路》](https://mp.weixin.qq.com/s/fr_NwtghRQagc_3ubk-hKQ)
|
||||||
|
|
||||||
|
- 前端入门路线和推荐学习资源，可以看这篇文章：[《2020年Web前端入门的自学路线》](https://www.cnblogs.com/qianguyihao/p/8776837.html)
|
||||||
|
|
||||||
|
|
||||||
|
## 学习交流
|
||||||
|
|
||||||
|
在公众号「千古壹号」里回复“**前端学习**”，拉你进微信交流群：
|
||||||
|
|
||||||
|
- 进群暗号：前端学习
|
||||||
|
|
||||||
|
- 进群要求：少提问、少闲聊、多分享（不适合长期潜水）。
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## 创作不易，赞赏作者
|
||||||
|
|
||||||
|
如果你觉得本教程对你有帮助，或者你想催更，不妨赞赏一下。
|
||||||
|
|
||||||
|
你的赞赏和认可，是我最大的动力：
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## LICENSE
|
## LICENSE
|
||||||
@ -31,38 +54,3 @@
|
|||||||
|
|
||||||
|
|
||||||
本作品采用[知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议](https://creativecommons.org/licenses/by-nc-sa/4.0/)进行许可。
|
本作品采用[知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议](https://creativecommons.org/licenses/by-nc-sa/4.0/)进行许可。
|
||||||
|
|
||||||
## 免费群
|
|
||||||
|
|
||||||
我建了一个“前端学习”的微信交流群，在公众号「千古壹号」里回复“**前端学习**”，拉你进群：
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 付费群
|
|
||||||
|
|
||||||
付费微信群的讨论氛围更浓厚，欢迎加入。费用为50元/年（随着群人数的增加，将不定期涨价）。
|
|
||||||
|
|
||||||
**付费群的用户权益**：
|
|
||||||
|
|
||||||
- 讨论：群里的讨论质量更高，分享氛围更好。
|
|
||||||
|
|
||||||
- 内推：提供国内几乎任何互联网大厂的内推机会。
|
|
||||||
|
|
||||||
- 信息源：群主对技术、产品、设计、软件工具等方面都很关注，可以相互交流优质信息。
|
|
||||||
|
|
||||||
- 生活圈子：大家一起交流技术、职场、生活经验、阅读写作等，让更多有趣的人建立连接。
|
|
||||||
|
|
||||||
|
|
||||||
**付费群的补充说明**：
|
|
||||||
|
|
||||||
- 本群已与Google达成战略合作，遇到问题可以先去Google上搜索。如果是在解决不了，可以在群里讨论。详见 [提问的智慧](https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md)、[群里提问的艺术](https://github.com/betaseeker/How-To-Ask-Questions)。
|
|
||||||
|
|
||||||
- 入群后，不退款，建议慎重考虑。
|
|
||||||
|
|
||||||
**入群方式**：
|
|
||||||
|
|
||||||
- 在公众号「千古壹号」里回复“**前端付费**”，加好友并付费后，拉你进群，进行深入交流。
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user