当前位置: 首页 > news >正文

前端开发笔记--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/

相关文章:

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

文章目录 前端开发工具--VsCode前端开发基础语法VsCode优秀插件Chinese --中文插件Auto Rename Tag --自动重命名插件open in browserOpen in Default BrowserOpen in Other Browser Live Server -- 实时预览 前端开发工具–VsCode 轻量级与快速启动 快速加载&#xff1a;VSCo…...

ARM/Linux嵌入式面经(四四):华星光电

文章目录 1、自我介绍2、介绍一下你最得意的一个项目3、这个项目里面都用到了什么模块,什么型号,有什么作用4、移植操作系统的过程中,流程是什么,需要注意什么移植操作系统的流程需要注意的事项面试官可能的追问及回答5、你用的传感器挺多的,怎么保证传感器传输的稳定性,…...

帮助,有奖提问

<?php $u $_GET[“user”]; //变量获取 $v $_GET[“variable”]; //$v看flag&#xff0c;绕过正则 $flag‘flag{}; if(isset($u)&&(file_get_contents($u,‘r’)“im admin”)){//猜测data://协议 //检查u指向 echo “hello admin!<br>”; if(preg_…...

Java编辑工具IDEA

哪个编程工具让你的工作效率翻倍&#xff1f; 在日益繁忙的工作环境中&#xff0c;选择合适的编程工具已成为提升开发者工作效率的关键。不同的工具能够帮助我们简化代码编写、自动化任务、提升调试速度&#xff0c;甚至让团队协作更加顺畅。那么&#xff0c;哪款编程工具让你…...

闲谈Promise

预备知识 回调函数&#xff1a;当一个函数作为参数传入另一个函数中&#xff0c;并且它不会立刻执行&#xff0c;当满足一定条件之后&#xff0c;才会执行&#xff0c;这种函数称为回调函数。比如&#xff1a;定时器。异步任务&#xff1a;与之对应的概念是同步任务&#xff0…...

【C++堆(优先队列)】1882. 使用服务器处理任务|1979

本文涉及知识点 C堆(优先队列) LeetCode1882. 使用服务器处理任务 给你两个 下标从 0 开始 的整数数组 servers 和 tasks &#xff0c;长度分别为 n​​​​​​ 和 m​​​​​​ 。servers[i] 是第 i​​​​​​​​​​ 台服务器的 权重 &#xff0c;而 tasks[j] 是处理…...

VBA高级应用30例应用3Excel中的ListObject对象:选择表的一部分

《VBA高级应用30例》&#xff08;版权10178985&#xff09;&#xff0c;是我推出的第十套教程&#xff0c;教程是专门针对高级学员在学习VBA过程中提高路途上的案例展开&#xff0c;这套教程案例与理论结合&#xff0c;紧贴“实战”&#xff0c;并做“战术总结”&#xff0c;以…...

C语言-变量

全局变量可以定义在头文件中吗&#xff1f; 在C和C编程中&#xff0c;全局变量可以定义在头文件中&#xff0c;但通常不建议这样做&#xff0c;因为这可能导致多个源文件&#xff08;.c 或 .cpp 文件&#xff09;包含同一个头文件时&#xff0c;发生多重定义错误&#xff08;m…...

linux下位机出现使用TCP socket为0的问题

问题现象&#xff1a;下位机做TCP服务器&#xff0c;上位机来连接下位机的TCP服务&#xff0c;中间会有主动断开&#xff08;上位机主动关闭socket&#xff09;和异常断开&#xff08;网线断开&#xff09;的情况&#xff0c;出现异常的时候&#xff0c;上位机连接下位机的TCP …...

论文笔记:Prototypical Verbalizer for Prompt-based Few-shot Tuning

论文来源&#xff1a;ACL 2022 论文地址&#xff1a;https://arxiv.org/pdf/2203.09770.pdfhttps://arxiv.org/pdf/2203.09770.pdf 论文代码&#xff1a;https://github.com/thunlp/OpenPrompthttps://github.com/thunlp/OpenPrompt Abstract 基于提示的预训练语言模型&#…...

nn.functional.softmax(X, dim=-1)

dim-1表示在最后一个维度&#xff08;大概率是一行&#xff09;应用Softmax函数&#xff0c;将值标准化为概率分布。 实例 假设我们有一个张量X&#xff0c;形状为&#xff08;2&#xff0c;3&#xff09;&#xff0c;内容如下&#xff1a; import torch import torch.nn.…...

【动态规划】子数组系列(上)

1. 最大子数组和 53. 最大子数组和 状态表示&#xff1a;以 i 位置为结尾时的所有子数组中的最大和 状态转移方程&#xff1a; i 位置为结尾的子数组又可以分为长度为 1 的和大于 1 的&#xff0c;长度为 1 就是 nums[i] &#xff0c;长度不为 1 就是 dp[i - 1] nums[i]&…...

字节青训营入门算法题:飞行棋分组

链接&#xff1a;飞行棋分组&#x1f517;&#x1f517; 题目 现在有一堆飞行棋棋子&#xff0c;每个棋子上标有数字序号。需要将这些棋子分成若干组&#xff0c;每组包含5个棋子&#xff0c;且组内所有棋子的数字序号必须相同。需要判断是否可以完成这样的分组。 解答 为了…...

# 执行 rpm -qa | grep qq 查询软件安装情况时报错 数据库损坏 db3 error(-30974)

执行 rpm -qa | grep qq 查询软件安装情况时报错 数据库损坏 db3 error(-30974) 一、问题描述&#xff1a; 在 linux 系统上&#xff0c;使用包管理工具 rpm 查询某一个软件安装情况&#xff0c;如&#xff1a;执行 rpm -qa | grep qq 时&#xff0c;报错 数据库损坏 db3 err…...

离线服务器上复现G3SR论文实验

代码地址:https://github.com/AllminerLab/Code-for-G3SR-master 论文地址:https://ieeexplore.ieee.org/abstract/document/9741079/ 因为直接按照作者的方法操作会出现问题,故笔者在这里记录一下的实验过程。 实验环境 python=3.6 pytorch pytorch的下载命令需要自行前往…...

Android 未来可能支持 Linux 应用,Linux 终端可能登陆 Android 平台

近日&#xff0c;根据 android authority 的消息&#xff0c;Google 正在开发适用于 Android 的 Linux 终端应用&#xff0c;而终端应用可以通过开发人员选项启用&#xff0c;并将 Debian 安装在虚拟机中。 在几周前&#xff0c;Google 的工程师开始为 Android 开发新的 Termi…...

PostgreSQL学习笔记十四:PL/Python自定义函数

在 PostgreSQL 中可以使用 PL/Python 语言来创建自定义函数。以下是一个示例步骤&#xff1a; 一、创建自定义函数 连接到 PostgreSQL 数据库&#xff0c;可以使用 psql 命令行工具或者通过数据库管理工具。 执行以下 SQL 语句创建一个简单的 PL/Python 函数&#xff1a; C…...

计算机毕业设计 | springboot商城售后管理系统 购物平台(附源码)

1&#xff0c;绪论 1.1 开发背景 在数字化时代的推动下&#xff0c;产品售后服务管理机构面临着信息化和网络化的挑战。传统的手工管理和纸质档案已经无法满足管理人员和读者的需求。为了提高产品售后服务管理机构的管理效率和服务质量&#xff0c;开发和实现一个基于Java的售…...

(全网独家)面试要懂运维真实案例:HDFS重新平衡(HDFS Balancer)没触发问题排查

在面试时&#xff0c;面试官为了考察面试者是否真的有经验&#xff0c;经常会问运维集群时遇到什么问题&#xff0c;解决具体流程。下面是自己遇到HDFS Balancer没执行&#xff0c;花了半天时间进行排查&#xff0c;全网独家的案例和解决方案。 目录 使用CDH自带重新平衡操作…...

【数据结构笔记】搜索树

二叉搜索树 任一节点x的左/右子树中&#xff0c;所有非空节点均不大于&#xff08;不小于&#xff09;x 必须是所有的非空节点&#xff0c;仅左右孩子不够&#xff08;左孩子的右孩子可能很大&#xff09;一棵二叉树是二叉搜索树当且仅当中序遍历序列是单调非降序列 两棵二叉…...

C++_核心编程_多态案例二-制作饮品

#include <iostream> #include <string> using namespace std;/*制作饮品的大致流程为&#xff1a;煮水 - 冲泡 - 倒入杯中 - 加入辅料 利用多态技术实现本案例&#xff0c;提供抽象制作饮品基类&#xff0c;提供子类制作咖啡和茶叶*//*基类*/ class AbstractDr…...

R语言AI模型部署方案:精准离线运行详解

R语言AI模型部署方案:精准离线运行详解 一、项目概述 本文将构建一个完整的R语言AI部署解决方案,实现鸢尾花分类模型的训练、保存、离线部署和预测功能。核心特点: 100%离线运行能力自包含环境依赖生产级错误处理跨平台兼容性模型版本管理# 文件结构说明 Iris_AI_Deployme…...

中南大学无人机智能体的全面评估!BEDI:用于评估无人机上具身智能体的综合性基准测试

作者&#xff1a;Mingning Guo, Mengwei Wu, Jiarun He, Shaoxian Li, Haifeng Li, Chao Tao单位&#xff1a;中南大学地球科学与信息物理学院论文标题&#xff1a;BEDI: A Comprehensive Benchmark for Evaluating Embodied Agents on UAVs论文链接&#xff1a;https://arxiv.…...

uni-app学习笔记二十二---使用vite.config.js全局导入常用依赖

在前面的练习中&#xff0c;每个页面需要使用ref&#xff0c;onShow等生命周期钩子函数时都需要像下面这样导入 import {onMounted, ref} from "vue" 如果不想每个页面都导入&#xff0c;需要使用node.js命令npm安装unplugin-auto-import npm install unplugin-au…...

关于iview组件中使用 table , 绑定序号分页后序号从1开始的解决方案

问题描述&#xff1a;iview使用table 中type: "index",分页之后 &#xff0c;索引还是从1开始&#xff0c;试过绑定后台返回数据的id, 这种方法可行&#xff0c;就是后台返回数据的每个页面id都不完全是按照从1开始的升序&#xff0c;因此百度了下&#xff0c;找到了…...

Golang dig框架与GraphQL的完美结合

将 Go 的 Dig 依赖注入框架与 GraphQL 结合使用&#xff0c;可以显著提升应用程序的可维护性、可测试性以及灵活性。 Dig 是一个强大的依赖注入容器&#xff0c;能够帮助开发者更好地管理复杂的依赖关系&#xff0c;而 GraphQL 则是一种用于 API 的查询语言&#xff0c;能够提…...

微服务商城-商品微服务

数据表 CREATE TABLE product (id bigint(20) UNSIGNED NOT NULL AUTO_INCREMENT COMMENT 商品id,cateid smallint(6) UNSIGNED NOT NULL DEFAULT 0 COMMENT 类别Id,name varchar(100) NOT NULL DEFAULT COMMENT 商品名称,subtitle varchar(200) NOT NULL DEFAULT COMMENT 商…...

IoT/HCIP实验-3/LiteOS操作系统内核实验(任务、内存、信号量、CMSIS..)

文章目录 概述HelloWorld 工程C/C配置编译器主配置Makefile脚本烧录器主配置运行结果程序调用栈 任务管理实验实验结果osal 系统适配层osal_task_create 其他实验实验源码内存管理实验互斥锁实验信号量实验 CMISIS接口实验还是得JlINKCMSIS 简介LiteOS->CMSIS任务间消息交互…...

什么?连接服务器也能可视化显示界面?:基于X11 Forwarding + CentOS + MobaXterm实战指南

文章目录 什么是X11?环境准备实战步骤1️⃣ 服务器端配置(CentOS)2️⃣ 客户端配置(MobaXterm)3️⃣ 验证X11 Forwarding4️⃣ 运行自定义GUI程序(Python示例)5️⃣ 成功效果![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/55aefaea8a9f477e86d065227851fe3d.pn…...

Android Bitmap治理全解析:从加载优化到泄漏防控的全生命周期管理

引言 Bitmap&#xff08;位图&#xff09;是Android应用内存占用的“头号杀手”。一张1080P&#xff08;1920x1080&#xff09;的图片以ARGB_8888格式加载时&#xff0c;内存占用高达8MB&#xff08;192010804字节&#xff09;。据统计&#xff0c;超过60%的应用OOM崩溃与Bitm…...