蓝旭工作室2023春季培训预习博客（一）

最新推荐文章于 2024-07-20 18:16:53 发布
最新推荐文章于 2024-07-20 18:16:53 发布
阅读量1.5k 收藏 26
点赞数 30
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/D1gnity_/article/details/129720994
版权

目录

前言

第一周有四个需了解的内容，如下

1.走进前端

2.vscode插件安装

3.认识浏览器

4.Gitee提交

一. 走进前端

前端即网站前台部分，运行在PC端，移动端等浏览器上展现给用户浏览的网页。随着互联网技术的发展，HTML5，CSS3，前端框架的应用，跨平台响应式网页设计能够适应各种屏幕分辨率，合适的动效设计，给用户带来极高的用户体验。

前端技术一般分为前端设计和前端开发，前端设计一般可以理解为网站的视觉设计，前端开发则是网站的前台代码实现，包括基本的HTML和CSS以及JavaScript/ajax，最新的高级版本HTML5、CSS3，以及SVG等。

二. VScode插件安装

VScode安装

VScode官网地址

VScode安装后默认语言为英语，可以通过以下几招将语言设置为中文

  1. 按快捷键“Ctrl+Shift+P”。
  2. 在“vscode”顶部会出现一个搜索框。
  3. 输入“configure language”，然后回车。
  4. “vscode”里面就会打开一个语言配置文件。
  5. 将“en-us”修改成“zh-cn”。
  6. 按“Ctrl+S”保存设置。
  7. 关闭“vscode”，再次打开就可以看到中文界面了。

        效果如图 

插件安装

在输入框中输入想要安装的插件名称，点击安装即可。安装后没有效果，可以重启vscode

以下是几个VScode中常用的插件

1.Auto Rename Tag

 2.Auto Close Tag

 3.open in browser

 4.Path Intellisense

三. 认识浏览器

浏览器是用来检索、展示以及传递Web信息资源的应用程序。Web信息资源由统一资源标识符( Uniform Resource Identifier，URI)所标记，它是一张网页、一张图片、一段视频或者任何在Web上所呈现的内容。使用者可以借助超级链接( Hyperlinks)，通过浏览器浏览互相关联的信息。

浏览器窗口组成

1、地址栏：用于输入网站的地址，IE（Internet Explorer）浏览器通过识别地址栏中的信息，正确连接用户要访问的内容。如要登录“网址之家”网，只需在地址栏中输入网址之家的网址：http://www.hao123.com，然后按[Enter]键或单击地址栏右侧的按钮即可。在地址栏中还附带了IE中常用命令的快捷按钮，如刷新(C)、停止(x)等，前进、后退按钮设置在地址栏前方。

2、菜单栏：由“文件” “编辑” “查看” “收藏夹” “工具”和“帮助”菜单组成。每个菜单中包含了控制IE工作的相关命令选项，这些选项包含了浏览器的所有操作与设置功能。

3、选项卡：从Internet Explorer7版本开始，IE浏览器可以使用多选项卡浏览方式，以选项卡的方式打开网站的页面。

4、页面窗口：是IE浏览器的主窗口，访问的网页内容显示在此。页面中有些文字或对象具有超链接属性，当鼠标指针放上去之后会变成手状，单击鼠标左键，浏览器就会自动跳转到该链接指向的网址；单击鼠标右键，则会弹出快捷菜单，可以从中选择要执行的操作命令。

5、状态栏：实时显示当前的操作和下载Web页面的进度情况。正在打开网页时，还会显示网站打开的进度。另外，通过状态栏还可以缩放网页。

浏览器内核

1、Trident内核

代表产品为Internet Explorer，又称其为IE内核。Trident（又称为MSHTML），是微软开发的一种排版引擎。使用Trident渲染引擎的浏览器有：IE、傲游、世界之窗浏览器、Avant、腾讯TT、Netscape 8、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等。

2、Gecko内核

代表作品为Mozilla Firefox。Gecko是一套开放源代码的、以C++编写的网页排版引擎，是最流行的排版引擎之一，仅次于Trident。使用它的最著名浏览器有Firefox、Netscape6至9。

3、WebKit内核

代表作品有Safari、Chrome。WebKit是一个开源项目，包含了来自KDE项目和苹果公司的一些组件，主要用于Mac OS系统，它的特点在于源码结构清晰、渲染速度极快。缺点是对网页代码的兼容性不高，导致一些编写不标准的网页无法正常显示。

4、Presto内核

代表作品Opera。Presto是由Opera Software开发的浏览器排版引擎，供Opera 7.0及以上使用。它取代了旧版Opera 4至6版本使用的Elektra排版引擎，包括加入动态功能，例如网页或其部分可随着DOM及Script语法的事件而重新排版。

Web服务器分类

1、IIS服务器。IIS服务器是微软提供的一种Web服务器，它主要是解析微软提供并开发的ASP和ASP.NET等后台语言，运行在Windows平台下，对IE内核的浏览器支持良好，并且有些调用Windows接口的Web应用程序只能采用IIS服务器进行解析。IIS服务器优点很多，但是缺点也很明显，通常Windows的漏洞容易导致其安全性大为降低。

2、Apache服务器。Apache服务器是开源基金组织Apache提供的一种Web服务器，主要是解析PHP文件，是一款功能强大的免费软件，支持多个操作系统，如Windows、Linux、MacOS等 。

3、Tomcat服务器。Tomcat服务器也是开源基金组织Apache提供的一种支持JSP组件的Web服务器，它支持Windows、Linux、Mac OS等多个操作系统，安装简便，使用也较为方便。

4、其他服务器。如JBoss、Weblogic、WebSphere等，这些服务器由于在商业上使用较多，也有部分需要付费。

四. Gitee提交

什么是Gitee

从2013年 Gitee 代码托管平台上线至推出企业版之前的三年多时间中，Gitee 平台已托管了 2000 万+个仓库，是国内知名的代码托管平台。经过了多年的不断完善和运营，Gitee 已经足以为企业的核心资产 —— 源代码，提供保驾护航服务。

1. 安装Git

要使用Gitee，需要先安装Git

Git下载地址

2. 登录Gitee

我们先在gitee上注册账号并登录。

Gitee官网

3. 创建仓库

创建仓库相关流程可以参考这篇文章http://t.csdn.cn/ZMOZhhttp://t.csdn.cn/ZMOZh

4. 克隆仓库至本地

点击克隆/下载，然后点击SSH，最后点击复制

接着，在本地目录空白处右键菜单，点击Git Bash Here

输入git clone 刚才复制的git链接，格式如下

git clone git@gitee.com:xu-dishu/edp445.git

 5. 添加文件，并执行git命令，提交文件

先在本地文件夹下添加一个文件

打开git，执行git的add、commit、push命令，即可将本地文件上传到远程仓库

 刷新gitee页面，即可看到本地文件已上传至仓库

D1gnity_
关注
  • 30
    点赞
  • 踩
  • 26
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
蓝旭V6刷机工具
12-29
需要准备工具：电脑、SD卡、读卡器（支持读取SD） 1、首先下载附件中的刷机制作工具PhoenixCard_V309.rar、刷机包。 2.解压刷机制作工具PhoenixCard_V309.rar，打开里面的PhoenixCard.exe程序。...
MauiMETA工具V6
01-17
射频部分是移动设备通信的核心，涉及到了如GSM、WCDMA、LTE、Wi-Fi等无线通信标准，而MauiMETA工具的出现使得这一领域的调试和优化工作变得更加便捷。 MauiMETA工具V6.1051.0可能包含以下主要功能： 1. **射频参数...
蓝旭工作室2023春季培训预习博客（五）
D1gnity_的博客
04-22 214
第三周有一个需了解的内容，如下DOM（文档对象模型）DOM是JavaScript操作页面的接口，全称“文档对象模型”（Document Object Model）。文档对象模型（DOM，Document Object Model）是HTML 和XML 文档的编程接口。DOM 表示由多层节点构成的文档，通过它开发者可以添加、删除和修改页面的各个部分。脱胎于网景和微软早期的动态HTML（DHTML，Dynamic HTML），DOM 现在是真正跨平台、语言无关的表示和操作网页的方式。
蓝旭工作室2023春季培训预习博客（二）
D1gnity_的博客
03-31 1427
第二周有两个需了解的内容，如下1. HTML常用标签2. CSS基础HTML是做网站的、Web开发、互联网生态开发(PC端+移动端+微应用) 目前我们使用的都是HTML5,支持传统的PC端开发，还支持移动端开发还支持微应用开发,从而替换了部分传统的移动端开发技术。HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本HTML。
蓝旭工作室2023春季培训预习博客（三）
D1gnity_的博客
04-06 368
第三周有一个需了解的内容，如下CSS进阶（盒子模型、浮动、定位、伪类、伪元素）CSS伪类是用来描述一个元素的特殊状态，比如第一个元素、某个元素的子元素、鼠标点击的元素设置鼠标悬停在元素上时的样式。为已访问和未访问链接设置不同的样式。设置元素获得焦点时的样式。
蓝旭工作室2023春季培训预习博客（六）
D1gnity_的博客
05-05 176
第六周有一个需了解的内容，如下BOM（浏览器对象模型）BOM 是 Browser Object Model，浏览器对象模型。BOM(Browser Object Model) 是指浏览器对象模型，是用于描述这种对象与对象之间层次关系的模型，浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成，其中代表浏览器窗口的Window对象是BOM的顶层对象，其他对象都是该对象的子对象。
蓝旭工作室2023春季培训预习博客（四）
D1gnity_的博客
04-13 151
第四周需学习Javascript基本语法JavaScript（简称“JS”是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中，JavaScript基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式、声明式、函数式编程范式。JavaScript在1995年由Netscape公司的，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape。
蓝旭工作室2023春季培训第六周预习博客
m0_74974446的博客
05-06 102
作用就是跟浏览器做一些交互效果,比如如何进行页面的后退，前进，刷新，浏览器的窗口发生变化，滚动条的滚动，以及获取客户的一些信息如：浏览器品牌版本，屏幕分辨率。浏览器的全部内容可以看成DOM，整个浏览器可以看成BOM。
蓝旭工作室2023春季培训第四周预习博客
m0_74974446的博客
04-15 189
如果condition为true，则执行语句1，并返回执行结果，如果为false，则执行语句2，并返回执行结果。这5种之外的类型都称为Object，所以总的来看JavaScript中共有六种数据类型。在一个单独的js文件中编写，然后在HTML中的script标签中引用。使用逗号运算符分隔的语句会从左到右顺序依次执行。在HTML的script标签中直接编写。使用逗号可以在一条语句中执行多次操作。
蓝旭工作室2023春季培训第三周预习博客
m0_74974446的博客
04-07 175
:first-letter p::first-letter 选择每个 元素的首字母。::first-line p::first-line 选择每个 元素的首行。::selection p::selection 选择用户选择的元素部分。::before p::before 在每个 元素之前插入内容。注：::before和::after来添加的内容是不可以被鼠标选中的。相对于自己原来位置，脱离标准流，移动之后，移动之前的位置仍然占有。
蓝旭工作室2023春季培训第五周预习博客
m0_74974446的博客
04-26 151
DOM全称文档对象模型，是W3C组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口。通过DOM接口可以改变网页的内容、结构和样式。
前端面试题日常练-day97 【Less】
最新发布
qq_44640575的博客
07-20 391
border-radius()函数用于在Less中生成圆形边框效果。通过设置border-radius()函数，我们可以为元素的边框添加圆角效果，使边框呈现圆形的外观，从而美化页面元素的边框样式。
TinyVue v3.17.0 正式发布，推出了一款基于 Quill 2.0 的富文本编辑器，功能强大、开箱即用！
OpenTiny的博客
07-17 1245
本文由体验技术团队Kagol老师原创~我们非常高兴地宣布，2024年6月26日，TinyVue 发布了 v3.17.0 🎉。TinyVue 每次大版本发布，都会给大家带来一些实用的新特性，上一个版本我们重构了 chart-core，新增 CircleProcessChart 圆环进度图等6个新的图表组件，并增加了 Statistic 数据统计组件。表格图片超链接复制粘贴插入表情文件上传@提醒斜杆菜单v-auto-tip。
LG 选择 Flutter 来增强其智能电视操作系统 webOS
恋猫de小郭的博客
07-17 1733
总的来说，LG 是 Flutter 在 TV 领域的一次新的尝试，并且它是在脱离了 Android 平台的场景下实现的支持，虽然 webOS 并不是什么流行的系统，但是这也体现出了 Flutter 的特点：可以用较低的成本实现较好性能的跨平台。后续，在 LG 的主导下，WebOS 经过进一步修改，转变为智能电视操作系统，于是 WebOS TV 就诞生了，此后 LG 的 TV 基本路线定为 webOS ，在应用层面，WebOS TV 以基于 Web 的技术为基础。然后 LG 为什么选择 webOS？
纯前端小游戏，4096小游戏，有音效，Html5，可学习使用
m0_62996549的博客
07-18 409
【代码】纯前端小游戏，4096小游戏，有音效，Html5，可学习使用。
前端性能优化--懒加载
weixin_43799793的博客
07-19 169
3、同时还可结合 lazy loading 属性，利用浏览器的原生属性，进一步优化图片加载，不过其延迟加载机制完全是由浏览器自身决定的，在不同浏览器上效果不同(BTW，部分浏览器可能并不支持)。2、然后对元素进行监听，当图片进入可视区域时，提取元素的 data-src 即真实的图片地址赋值给 src 属性，就会去发送请求加载图片，实现了懒加载。设置为 1 张 1px*1px 的透明图片用作占位符，以防止出现出错图标。TinyPNG 网站: https://tinypng.com/
[web]-反序列化-绕过__wakeup(转)
mails2008的专栏
07-18 376
终点：很直接是echo $flag,在__destruct中，username==='admin' 和 password==100。反序列化过程中发现起点在终点之前调用，反而是捣乱的，那我们就不需要自动执行__wakeup，绕过的方法，设置的字段数量比实际字段大的值。其实简单的很简单，难得也很难，慢慢学习就好，没必要焦虑，觉得很难，纯粹一个兴趣爱好就行。起点：_wakeup函数中是$this->username='guest',是给赋值；按照常规思路，寻找起点、终点、跳板。
vue3前端开发-如何让自己的网站适合SEO排名规则
yrldjsbk的博客
07-17 258
我们大家都知道，原始出生的vue3项目，原始代码层面，是没有meta标签的，也就是说，不适合SEO排名规则。SEO排名规则，蜘蛛爬虫抓取网站页面的内容，就会把这种meta标签内容进行采集，匹配。但是，这个技术要求大家还是应该知道的。黑马教育，课程，前端课程案例项目：小兔鲜儿超市，vue3前端项目案例。想学习vue3前端开发，拿来练习，实战的朋友们，值得一看哦。这个代码，就是我自己手工录入的。录入后，再次在浏览器界面刷新请求服务器。返回的代码模块就可以看见了。自己刚刚手工录入的meta信息出现了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值