前端开发笔记--html 黑马程序员1

文章目录

  • 前端开发工具--VsCode
  • 前端开发基础语法
  • VsCode优秀插件
    • Chinese --中文插件
    • Auto Rename Tag --自动重命名插件
    • open in browser
      • Open in Default Browser
      • Open in Other Browser
    • Live Server -- 实时预览


前端开发工具–VsCode

  1. 轻量级与快速启动
    快速加载:VSCode 启动速度快,占用系统资源少,更适合快速编辑和调试代码。
    灵活性:可以根据需要安装扩展,保持轻量,避免复杂功能的干扰。
  2. 强大的扩展性
    丰富的插件生态:VSCode 拥有大量的插件,可支持各种编程语言、框架和工具,例如 React、Angular、Vue.js 和 SASS。
    自定义功能:用户可以根据个人需求安装或开发扩展,提高开发效率。
  3. 智能代码补全
    IntelliSense:提供上下文感知的代码补全,自动完成变量、函数、方法名等,有助于减少拼写错误和提高编码速度。
    文档提示:在输入时,VSCode 会自动提供函数的文档和参数提示,帮助开发者更好地理解和使用 API。
  4. 内置调试功能
    调试器:VSCode 提供强大的调试功能,可以直接在编辑器中设置断点、检查变量值、单步执行代码等,极大地提升了调试效率。
    支持多种语言:支持 JavaScript、TypeScript 等多种语言的调试,便于前端开发者进行调试工作。
  5. 终端集成
    内置终端:VSCode 内置终端,可以直接在编辑器中执行命令,无需切换到其他窗口,提升了工作流的效率。
    Git 集成:内置 Git 功能,可以方便地进行版本控制、提交代码、解决冲突等操作。
    在这里插入图片描述
    在这里插入图片描述

前端开发基础语法

1.前端开发框架代码

< !DOCTYPE html>
< html lang=“en”>
< head>
< meta charset=“UTF-8”>
< meta http-equiv=“X-UA-Compatible” content=“IE=edge”>
< meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
< title>Document
< /head>

< body>

< /body>
< /html>
在这里插入图片描述
在这里插入图片描述

VsCode优秀插件

Chinese --中文插件

VsCode在刚下载完成后默认是英文的,这对我们这些中国程序员来说很不友好,为了解决这个问题我们可以选择在VsCode中安装一个这个插件,在安装并重启VsCode后VsCode便会将语言调整为中文。
在这里插入图片描述
在这里插入图片描述

Auto Rename Tag --自动重命名插件

这个插件能够帮助我们进行快捷的修改标签在我们修改前一个·标签,后一个标签也会改动。
在这里插入图片描述

open in browser

这个插件能够让我们选择想要的浏览器进行预览
在这里插入图片描述
在这里插入图片描述

Open in Default Browser

用默认的浏览器打开
在这里插入图片描述

Open in Other Browser

用其他浏览器打开(前提是你的电脑已经安装了这些浏览器)
在这里插入图片描述

Live Server – 实时预览

这个插件能够让我们实时看到我们修改后的代码的效果,而不需要在每次修改后都刷新浏览器。
在这里插入图片描述
在这里插入图片描述
由于篇幅的原因在这里便简单介绍一下一些比较重要的插件,黑马那边有更加全面的插件
https://www.bilibili.com/read/cv9698270/
快捷命令则是这个:
https://www.bilibili.com/read/cv9699783/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/446811.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

10个Python自动化脚本,让日常任务轻松便捷!

Python 以其简单易学的语法和强大的库支持,使得它成为实现自动化任务的理想语言.无论是个人日常工作,还是企业的流程优化,Python 都可以通过自动化脚本帮助节省时间、提升效率.以下是10个令人不可思议的 Python 自动化脚本,涵盖了从文件管理、网络爬虫到数据处理的各个领域. 1…

深度学习-24-基于keras的十大经典算法之残差网络ResNet

文章目录 1 残差网络(ResNet)1.1 ResNet简介1.2 ResNet结构2 模型应用2.1 加载数据2.2 构建模型SimpleResNet2.2.1 simple_resnet_block2.2.2 SimpleResNet2.2.3 实例化模型2.2.4 模型训练2.2.5 模型预测2.3 构建模型ResNet182.3.1 residual_block2.3.2 ResNet182.3.3 训练模型…

设计模式——门面模式 | 外观模式

哈喽&#xff0c;各位盆友们&#xff01;我是你们亲爱的学徒小z&#xff0c;今天给大家分享的文章是设计模式的——门面模式。 文章目录 定义通用类图1.通用结构2.优点3.缺点 使用场景注意事项1.一个子系统可以有多个门面2.门面不参与子系统内的业务逻辑 定义 定义&#xff1a;…

python画图|两个Y轴共享X轴

【1】引言 在前述学习中&#xff0c;对使用matplotlib模块输出图形已经非常熟练&#xff0c;但常见的画图方式并未穷尽&#xff0c;如两个Y轴共享X轴就没有探索过。 对此&#xff0c;我进行了一些学习&#xff0c;获得一些心得&#xff0c;在此和大家共享。 【2】官网教程 …

鸿蒙开发(NEXT/API 12)【使用fetchsync发送同步网络请求】远场通信服务

场景介绍 发送一个同步HTTP请求&#xff0c;也可以设置请求头和请求体等参数&#xff0c;并返回来自服务器的HTTP响应。常用于获取资源&#xff0c;支持通过拦截器来处理请求和响应。 接口说明 接口名描述Rcp_Response *HMS_Rcp_FetchSync(Rcp_Session *session, Rcp_Reques…

【Linux第一弹】- 基本指令

&#x1f308; 个人主页&#xff1a;白子寰 &#x1f525; 分类专栏&#xff1a;重生之我在学Linux&#xff0c;C打怪之路&#xff0c;python从入门到精通&#xff0c;数据结构&#xff0c;C语言&#xff0c;C语言题集&#x1f448; 希望得到您的订阅和支持~ &#x1f4a1; 坚持…

Window7上微信小程序开发工具上,小程序界面空白

目录 背景 解决方案 背景 微信小程序开发工具不断升级&#xff0c;自从1.06后不再支持Window7系统。安装1.05版本开发工具软件&#xff0c;新建小程序后&#xff0c;小程序界面空白&#xff0c;真机显示正常&#xff0c;但是对于开发者来说很不友好。 解决方案 点击“设置-&…

selenium的IDE插件进行录制和回放并导出为python/java脚本(10)

Selenium IDE&#xff1a;Selenium Suite下的开源Web自动化测试工具&#xff0c;是Firefox或者chrome的一个插件&#xff0c;具有记录和回放功能&#xff0c;无需编程即可创建测试用例&#xff0c;并且可以将用例直接导出为可用的python/java等编程语言的脚本。 我们以chrome浏…

今日最佳WAF雷池社区版,tengine问题解决办法

很多第一次使用雷池社区版的朋友会碰到tengine相关的问题 其实官方文档都有记录怎么排除&#xff0c;这里都单独把tengine的排查方法再说一下 请检查防火墙规则&#xff0c; tengine 容器状态和日志 如果站点报错如上&#xff0c;说明tengine容器可能出现问题&#xff0c;需…

Element Ui el-table列表中的tooltip内容过长超出屏幕换行显示

elementui-table组件列表中的tooltip内容过长超出屏幕换行显示内容,虽然el-table列属性中带的有show-overflow-tooltip&#xff0c;可以设置内容超出列宽度显示为…&#xff0c;且有tooltip提示全部内容&#xff0c;但是内容过多时&#xff0c;提示会超出屏幕&#xff1a; 只有…

Excel:vba实现拆分单元格成一字一单元格

我拿到的表格如下&#xff1a; 我想实现的表格效果如下&#xff1a; 要求就是&#xff1a;将A列的千字文拆分成一个单元格一个字&#xff0c;并整理成4列 我这里是将效果呈现到一个新的表里面&#xff0c;没有在原表里面(在原表里…

【C语言】深入理解指针(三)(下)

本篇文章将讲解以下知识&#xff1a; 1、二维数组传参的本质 2、函数指针变量 3、函数指针数组 1、二维数组传参的本质 有了数组指针的理解&#xff0c;我们就能弄清楚二维数组传参的本质了 例如&#xff1a; 在一维数组中&#xff0c;数组名是数字首元素的地址。但有两个例外…

如何在UE5中创建加载屏幕(开场动画)?

第一步&#xff1a; 首先在虚幻商城安装好Async Loading Screen&#xff0c;并且在项目的插件中勾选好。 第二步&#xff1a; 确保准备好所需要的素材&#xff1a; 1&#xff09;开头的动画视频 2&#xff09;关卡加载图片 3&#xff09;准备至少两个关卡 第三步&#xff1a…

【隐私计算篇】一种批量匿踪查询友好算法PIRANA的原理分析

1. 背景分析 前段时间开展了批量匿踪查询算法迭代优化的工作&#xff0c;取得了一些进展。不得不说&#xff0c;甲方爸爸永远会提出非常有挑战性的目标&#xff0c;push你去想各种解决方案。在实际的算法研发落地上&#xff0c;我们会结合算法本身的机制改进以及工程优化这两方…

创客项目秀 | 基于使用 XIAO BLE Sense 和 Edge Impulse 的宠物活动跟踪器

今天为大家带来的是来自美国的创作者米顿-达斯的作品:宠物活动跟踪器.这个装置主要是为宠物主人提供关于宠物日常活动量的详尽数据&#xff0c;还能够根据宠物的独特需求&#xff0c;提供个性化的健康建议和活动指导。 项目背景 为了全面促进宠物的健康与活力&#xff0c;采用…

在 MTT GPU 上使用 llama.cpp 推理

大语言模型因其出色的自然语言理解和生成能力而迅速被广泛使用&#xff0c;llama.cpp 大幅降低了进行大语言模型推理的门槛&#xff0c;MTT GPU 同样也是 llama.cpp 支持的运行平台&#xff0c;能够充分利用硬件的性能来助力用户的大语言模型应用。 本文主要介绍了如何在摩尔线…

『网络游戏』客户端发送消息到服务器【17】

将上一章服务器的协议PEProtocol的.dll文件重新生成导入unity客户端中 命名为Net 点击生成 另一种导入.dll文件方式 在客户端粘贴即可 此时Net文件夹的.dll文件就导入进来了 创建脚本&#xff1a;NetSvc.cs 编写脚本&#xff1a;NetSvc.cs 修改脚本&#xff1a;GameRoot.cs 在…

Cherno游戏引擎笔记(61~72)

---------------一些维护和更改------------- 》》》》 Made Win-GenProjects.bat work from every directory 代码更改&#xff1a; echo off->pushd ..\->pushd %~dp0\..\call vendor\bin\premake\premake5.exe vs2019popdPAUSE 为什么要做这样的更改&#xff1f; …

基于微信小程序的购物系统php+论文源码调试讲解

2相关技术 2.1微信小程序 小程序是一种新的开放能力&#xff0c;开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播&#xff0c;同时具有出色的使用体验。尤其拥抱微信生态圈&#xff0c;让微信小程序更加的如虎添翼&#xff0c;发展迅猛。 2.2 MySQL数据…

【论文阅读】SRCNN

学习资料 论文题目&#xff1a;Learning a Deep Convolutional Network for Image Super-Resolution&#xff08;学习深度卷积网络用于图像超分辨率&#xff09;论文地址&#xff1a;link.springer.com/content/pdf/10.1007/978-3-319-10593-2_13.pdf代码&#xff1a;作者提出的…