# NOTE_HTML5

**Repository Path**: vectorx/note_html5

## Basic Information

- **Project Name**: NOTE_HTML5
- **Description**: 尚硅谷Web前端HTML5 CSS3初学者零基础入门全套完整版学习笔记
- **Primary Language**: HTML/CSS
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 18
- **Forks**: 26
- **Created**: 2021-05-13
- **Last Updated**: 2025-03-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: HTML, CSS, H5

## README

# NOTE_HTML5

## 介绍

:sparkles:尚硅谷Web前端*HTML5 CSS3*初学者零基础入门全套完整版学习笔记



## 更新

- 语雀:link:：[Web前端HTML5&CSS3 · 语雀 (yuque.com)](https://www.yuque.com/u21195183/hfcamg)
- Github:link:：[vectorxxxx/NOTE_HTML5: 尚硅谷Web前端HTML5 CSS3初学者零基础入门全套完整版学习笔记 (github.com)](https://github.com/vectorxxxx/NOTE_HTML5)
- Gitee:link:：[NOTE_HTML5: 尚硅谷Web前端HTML5 CSS3初学者零基础入门全套完整版学习笔记 (gitee.com)](https://gitee.com/vectorx/note_html5)
- CC:link:：[VectorUx / NOTE_HTML5 · CODE CHINA (csdn.net)](https://codechina.csdn.net/qq_35925558/note_html5)

:sparkles:看文档推荐使用**语雀**，感觉更加简洁；需要图片资源的推荐下面几个代码托管平台，都是同步更新的哦！

:sparkles:同时，为了更方便大家在托管平台上直接看，特意整理了一下结构（因为默认只有README文件会有目录结构，所以每节单独放到了一个文件夹下面）

:sparkles:其他平台因为审核限制的原因，内容上应该没有上面几个全，大家可以自行选择

- 博客园:link:：[Web前端HTML5&CSS3 - 随笔分类 - VectorX - 博客园 (cnblogs.com)](https://www.cnblogs.com/vectorx/category/1975212.html)
- CSDN:link:：[Web前端_VectorX's Blog-CSDN博客](https://blog.csdn.net/qq_35925558/category_11061834.html)
- 掘金:link:：[VectorX 的个人主页 - 文章 (juejin.cn)](https://juejin.cn/user/1794840859509070/posts)

:sparkles:另外，新搭建了一个*Github Pages*网站，大家可以去尝尝鲜~

- 我的博客:link:：[标签 | VectorX (vectorxxxx.github.io)](https://vectorxxxx.github.io/tags/#15-html5css3)

<mark>**整理不易，还望各位看官一键三连 :heart: :heart: :heart: **</mark>

<mark>**整理不易，还望各位看官一键三连 :heart: :heart: :heart: **</mark>

<mark>**整理不易，还望各位看官一键三连 :heart: :heart: :heart: **</mark>

:sparkles:下面开始吧~



---



:sparkles:目前，因为本人是*边学边更*的，目前还没有学习完毕，所以暂时只整理了这些



## 软件

:sparkles:视频中使用到的软件和资源，还有一些其他的开发工具，仅供参考（eg. 考虑到部分下载速度的问题，特意整理了部分软件到Software仓库下，大家可以自取）

### Zeal

- 离线文档：[Zeal - Offline Documentation Browser](https://zealdocs.org/)

### NotePad

- 官方地址：[notepad-plus-plus.org](http://notepad-plus-plus.org/)
- Softonic地址：[Notepad++ - Download (softonic.com)](https://notepad-plus.it.softonic.com/)

### Sublime

- 官方地址：[Sublime Text - A sophisticated text editor for code, markup and prose](https://www.sublimetext.com/)

### VS Code

- 官方地址：[Visual Studio Code - Code Editing. Redefined](https://code.visualstudio.com/)
- 安装的插件
  - Chinese (Simplified) Language Pack for Visual Studio Code
  - Ayu
  - vscode-icons
  - Live Server
  - JS & CSS Minifier (Minify)

### Atom

- 官方地址：[Atom](https://atom.io/)

- Github地址：[atom/atom: The hackable text editor (github.com)](https://github.com/atom/atom)

- 中文地址：[Atom中文网 (baisheng999.com)](http://atom.baisheng999.com/)

### WebStorm

- 官方地址：[Download WebStorm: The Smartest JavaScript IDE by JetBrains](https://www.jetbrains.com/webstorm/download/#section=windows)

### FastStone Capture

- 下载地址：[FastStone Capture - Download](https://faststone-capture.en.softonic.com/)

### Photoshop精简版

- 下载地址：[Adobe_Photoshop_CS6_Lite.7z - 蓝奏云 (lanzoui.com)](https://cheat8.lanzoui.com/iD3rBp7d02h)



## 网址

### 字符实体

- [HTML 字符实体](https://www.w3school.com.cn/html/html_entities.asp)
- [HTML ISO-8859-1 参考手册](https://www.w3school.com.cn/charsets/ref_html_8859.asp)

### CSS Dinner

- 官方地址：[CSS Diner - Where we feast on CSS Selectors!](https://flukeout.github.io/)

### reset样式

- 官方地址：[reset.css](https://meyerweb.com/eric/tools/css/reset/)

### normalize样式

- 官方地址：[normalize.css](https://necolas.github.io/normalize.css/8.0.1/normalize.css)

### 贝叶斯曲线

- 在线地址：[https://cubic-bezier.com](https://cubic-bezier.com)



## 实战

- :white_check_mark: 京东图片列表
- :white_check_mark: 京东左侧导航条
- :white_check_mark: 网易新闻列表
- :white_large_square:田径场（这个是我自己学完盒模型之后突发奇想的，大家可以忽略跳过）
- :white_check_mark: w3school顶部导航栏
- :white_check_mark: 京东轮播图
- :white_check_mark: 京东顶部导航条
- :white_check_mark: 背景按钮
- :white_check_mark: 电影卡片
- :white_check_mark: 小米商城
- :white_check_mark: 米兔
- :white_check_mark: 奔跑的少年
- :white_check_mark: 奔跑的川普
- :white_check_mark: 弹力球
- :white_check_mark: 酷炫球
- :white_check_mark: 鸭子表
- :white_check_mark: 复仇者联盟



## 字体

demo\font\

- ZCOOLKuaiLe-Regular.ttf
- ZCOOLQingKeHuangYou-Regular.ttf
- ZCOOLXiaoWei-Regular.ttf



整理难免有疏忽和遗漏的地方，欢迎大家指正批评！



---

> 署名 4.0 国际 (CC BY 4.0)。您可以自由地：共享 — 在任何媒介以任何形式复制、发行本作品；演绎 — 修改、转换或以本作品为基础进行创作；在任何用途下，甚至商业目的。只要你遵守许可协议条款，许可人就无法收回你的这些权利。惟须遵守下列条件：署名 — 您必须给出适当的署名，提供指向本许可协议的链接，同时标明是否（对原始作品）作了修改。您可以用任何合理的方式来署名，但是不得以任何方式暗示许可人为您或您的使用背书。