day2
理解CSS｜ 青训营笔记这是我参与「第五届青训营 」笔记创作活动的第2天
一、本堂课重点内容：
CSS代码构成、使用方法
CSS流程之选择器、文本渲染
CSS选择器的特异性、继承
CSS求值过程、调试方法
CSS布局方式及相关技术
CSS行级、块级盒模型
二、详细知识点介绍：1. CSS是什么
Cascading Style Sheets
用来定义页面元素的样式
设置字体和颜色
设置位置和大小
添加动画效果
2. 基本构成1234选择器 { 属性名: 属性值: /*属性名与属性值组成的语句是一个声明*/}
3. 在页面中使用CSS1. 外链式
引入同一文件夹下的CSS文件，需要在头部写入即可引入CSS文件
2. 嵌入式
在头部将CSS样式内容写入标签中，一般适用于长沙市样式较少时
3. 内联式
直接在标签内引入style，并将CSS样式写入
4. 选择器
找出页面中的元素，以便给他们设置样式
使用多种方式选择元素
按照标签名、类名或者id(#)
按照属性
按照DOM树中的位置
1. 类选择器
123456789<li class=& ...
day1
前端与 HTML | 青训营笔记这是我参与「第五届青训营 」笔记创作活动的第1天。
一、本节课重点内容：
前端工作的定义
前端技术栈拆解与分析
HTML作用分析
HTML语义化
二、详细知识点介绍：1. 什么是前端
解决GUI人机交互问题
跨终端
PC/移动浏览器
客户端/小程序
VR/AR等
Web技术栈
前端由和HTML、CSS、JavaScript三部分构成，分别负责网页的内容、样式和行为，在网络协议的联系下，上传至服务器端
2. 前端要关注的方面包括但不限于功能、安全、无障碍、体验、性能、美观、兼容等方面
3. 前端的边界node、Electron、React Nation、WebRTC、WebGL、WebASSEMBLY等
4. 开发环境
浏览器：IE/Edge、Chrome、Firefox、Safari等
编辑器：VSCode、Vim、WebStorm等
5. HTML是什么HTML包括
HyperText(包括图片、标题、链接、表格等多种形式)
Markup Language(一种专门用来标记的语言)
6. D ...
发现的一些宝藏脚本
在使用edge浏览器时，发现的一些宝藏脚本
配置环境在浏览器右上角有一个扩展按钮，点击后选择管理扩展，打开后点击“获取扩展”的按钮，然后搜索Tampermonkey，获取油猴脚本，当扩展中有油猴脚本时，配置环境就准备好了，接下来就可以放大招啦
User scripts (greasyfork.org)这个网址一定要保存好哦
当安装好扩展之后，在想要应用的页面刷新，点击扩展应用后才生效哦
1. 汉化Notion
相信有很多人想用Notion却被全英文界面劝退，这次，汉化版Notion来啦
安装好油猴之后，打开上面的网址，输入notion选择图片中的安装插件
打开notion官网，然后点击扩展应用，当看到页面变为中文时，就说明汉化成功了
点击左上角的省略号按钮，选择应用，选择“将此站点作为应用安装”
然后在桌面上就会出现刚刚安装的notion，就汉化完成了
2. 免费看视频
打开刚才的网址，找到名为[timerd][The Eight Hundred] VIP Video tencent, iqiyi, mgtv, youku, Blibili, s ...
BOM总结
BOM总结BOM概述BOM（Browser Object Model）即浏览器对象模型，它提供了==独立于内容==而与==浏览器窗口==进行交互的对象，其核心对象是 window
BOM 由一系列相关的==对象==构成，并且每个对象都提供了很多方法与属性。BOM 缺乏标准，JavaScript 语法的标准化组织是 ECMA，DOM 的标准化组织是 W3C，BOM 最初是Netscape 浏览器标准的一部分
1. DOM与BOM的区别DOM
文档对象模型
DOM是把文档当做一个对象来看待
DOM的顶级对象是document
DOM主要学习的是操作页面元素
DOM是W3C标准
BOM
浏览器对象模型
把浏览器当做一个对象来看待
BOM的顶级对象是window
BOM学习的是浏览器窗口交互的一些对象
BOM是浏览器厂商在各自浏览器上定义的，兼容性较差
2. BOM构成BOM比DOM更大，包含了DOM
window对象是浏览器的顶级对象，具有双重角色
是JS访问浏 ...
DOM总结
DOM知识总结DOM简介文档对象模型(简称DOM)，是W3C组织推荐的处理可扩展标记语言(HTML或XML)的标准==编程接口==，通过这些DOM接口可以改变网页的内容、结构、样式。
包括内容：
文档：一个页面就是一个文档，DOM中使用document表示
元素：页面中的==所有标签==都是元素，DOM中使用element表示
节点：页面中的所有内容都是节点(标签、属性、文本、注释等)，DOM中使用node表示
DOM把以上内容都看做是==对象==
获取页面元素DOM在实际开发中主要用来操作元素
获取页面中元素可以使用以下几种方式：
1. 获取ID获取getElementById()
1234567<body> <div id="box"></div> <script> var box = document.getElementById('box'); ...
正则表达式
正则表达式测试正则表达式test()正则对象方法，用于检测字符串是否符合该规则
12regexObj.test(str)//用来检测str文本是否符合正则表达式规范
边界符用来提示字符所处的位置，主要有两个字符
^ 表示匹配行首的文本(以谁开始)
$ 表示匹配行尾的文本(以谁结束)
12345678910111213let rg = /abc/; //正则表达式里面不需要加引号，不管是数字型还是字符串型// /abc/ 只要包含abc这个字符串返回的都是trueconsole.log(rg.test('abcd'));console.log(rg.test('aabcd'));let reg = /^abc/;// /^abc/必须以abc字符串开头console.log(reg.test('abcd')); //trueconsole.log(reg.test('aabcd')); //falselet reg1 = /^abc$/;// 精准匹配，要求必须是abc字符串才符合规范 ...
新年快乐
file:///C:/Users/www/Desktop/%E6%96%B0%E5%BB%BA%E6%96%87%E4%BB%B6%E5%A4%B9%20(2)/index.html
搭建个人博客
这几天，通过从网上寻找各种搭建教程，不断尝试，再删除，再尝试，我终于战战兢兢的搭建了自己简陋的博客系统，这里放上网址，欢迎大家的访问哦
https://cat711.github.io/
环境与工作准备需要安装的程序（相信大家都有）
Node
下载地址：https://nodejs.org/en/download/
打开CMD窗口，运行如下命令,修改npm源
1npm config set registry https://registry.npm.taobao.org
Git
Hexo
新建一个文件夹，在git bash执行命令安装hexo
1npm install -g hexo-cli
安装完后输入hexo -v验证是否安装成功，若出现版本号则表明安装成功
github配置
点击右上角的+按钮，选择New repository,创建一个<用户名>.github.io的仓库,选项同之前创建仓库相同
在git bash窗口ssh-keygen -t rsa -C "你的邮箱"在C盘的用户文件夹下的.ssh文件夹，会看到id_r ...
