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

IDEA敲Web前端快捷键

1.html基础格式

英文符号+TAB键

<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
</head>
<body></body>
</html>
2.单行注释

让输入光标在任意位置,Ctrl+/,将会将光标所在行全部注释掉

<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge">
<!--    <title>Document</title>-->
</head>
<body></body>
</html>
3.多行注释

选中,ctrl+/

<!--<!doctype html>-->
<!--<html lang="en">-->
<!--<head>-->
<!--    <meta charset="UTF-8">-->
<!--    <meta name="viewport"-->
<!--          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">-->
<!--    <meta http-equiv="X-UA-Compatible" content="ie=edge">-->
<!--&lt;!&ndash;    <title>Document</title>&ndash;&gt;-->
<!--</head>-->
<!--<body>--><!--</body>-->
<!--</html>-->

注意:CSS与html的注释不一样

4.同时编辑

就是同时输入一样的字

AIT+鼠标点击

</head>
<body>yanxao
yanxao
yanxao
yanxao
yanxao
yanxao
</body>yanxao
</html>

image-20241125212940940

5.标签补全快捷键

先打标签div,然后在div的任意位置按TAB键

image-20241125213232590

<div></div>
6.同时输入多个标签

现写标签,然后*x,然后tab键

image-20241125213215009

image-20241125213146571

7.父标签同时输入多个子标签

(无序列表和有序列表的可以)

输完之后,按tab键

image-20241125213503961

<ul><ol></ol><ol></ol><ol></ol><ol></ol><ol></ol><ol></ol>
</ul>
8.前后输入兄弟标签

直接输入div+p,然后tab键

<div></div>
<p></p>
9.类选择快捷键

输入.xx之后,然后tab键

image-20241125214101525

父子类的输入方法

image-20241125214127509

10.Css快捷键

直接输入w300然后tab键

image-20241125214907691

11.Css快捷键

将-前后的首字母打出来之后,可以选择

bc之后可以选择

image-20241125220044047

Html代码总结
<!doctype html>             <!--1.html代码基础格式的快速填写(英文的感叹号+tab键)-->
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge">
<!--    <title>Document</title>-->   <!--2.单行注释(在行的任意位置,ctrl+/)--><!--3.多行注释(选中,然后ctrl+/)-->
</head>
<body>
yanxiao                               <!--4.同时编辑(Ait+鼠标点击)-->
yanxiao                               <!--4.同时编辑(Ait+鼠标点击)-->
yanxiao                               <!--4.同时编辑(Ait+鼠标点击)-->
yanxiao                               <!--4.同时编辑(Ait+鼠标点击)-->div                                   <!--5. 标签补全快捷键(输入好标签之后,tab键)-->
<div></div>
div*4                                  <!--6.同时编辑多个标签(输入好标签之后*次数之后,tab键)-->
<div></div>
<div></div>
<div></div>
<div></div><!--7.父标签同时输入多个子标签(输入父子关系之后*儿子个数,tab键)-->
ul>ol*5
<ul><ol></ol><ol></ol><ol></ol><ol></ol><ol></ol><ol></ol>
</ul><!--8.输入前后兄弟(输入好关系之后,tab键)-->
div+p
<div></div>
<p></p>.xx                                    <!--9.类选择器的快捷键(输入点+类名之后tab键)-->
<div class="xx"></div>.xx>.yy                                <!--9.父子类选择器的快捷键(输入父子关系之后tab键)-->
<div class="xx"><div class="yy"></div>
</div></body>
</html>
Css代码总结
/* 定义 .xx 类的样式 */
.xx {w300                      /*10.直接输入首字母+数值,然后tab键  */width: 300px;        /* 设置宽度为300像素 */height: 200px;       /* 设置高度为200像素 */bcbackground-color: lightblue; /* 设置背景颜色为浅蓝色 */padding: 20px;       /* 内边距为20像素 */border: 1px solid black; /* 边框为1像素实线黑色 */
}/* 定义 .yy 类的样式 */
.yy {width: 100%;         /* 设置宽度为100%,即父元素的宽度 */height: 50%;         /* 设置高度为50%,即父元素高度的一半 */background-color: lightgreen; /* 设置背景颜色为浅绿色 */margin-top: 10px;    /* 上边距为10像素 */
}

相关文章:

IDEA敲Web前端快捷键

1.html基础格式 英文符号TAB键 <!doctype html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport"content"widthdevice-width, user-scalableno, initial-scale1.0, maximum-scale1.0, mini…...

【Vue3】【Naive UI】<NDropdown>标签

【Vue3】【Naive UI】 标签 基本设置自定义渲染交互事件其他属性 【VUE3】【Naive UI】&#xff1c;NCard&#xff1e; 标签 【VUE3】【Naive UI】&#xff1c;n-button&#xff1e; 标签 【VUE3】【Naive UI】&#xff1c;a&#xff1e; 标签 【VUE3】【Naive UI】&#xff1c…...

技术总结(四十一)

一、MySQL 索引概述 索引的概念&#xff1a;索引就好比一本书的目录&#xff0c;它能帮助 MySQL 快速定位到表中的数据行&#xff0c;而不用全表扫描。通过创建合适的索引&#xff0c;可以大大提高查询的效率。例如&#xff0c;在一个存储了大量员工信息的表中&#xff0c;如果…...

Android布局

一、线性布局 属性&#xff1a;orientation vertical horizontal layout_weight【水平均分&#xff0c;width"0dp"】 layout_height layout_width 小动物连连看 1<?xml version"1.0" encoding"utf-8"?>2<LinearLayout xmlns:and…...

k8s集成skywalking

如果能科学上网的话&#xff0c;安装应该不难&#xff0c;如果有问题可以给我留言 本篇文章我将给大家介绍“分布式链路追踪”的内容&#xff0c;对于目前大部分采用微服务架构的公司来说&#xff0c;分布式链路追踪都是必备的&#xff0c;无论它是传统微服务体系亦或是新一代…...

如何写一份优质技术文档

作者简介&#xff1a; 本文作者拥有区块链创新专利30&#xff0c;是元宇宙标准化工作组成员、香港web3标准工作组成员&#xff0c;参与编写《数据资产确权与交易安全评价标准》、《链接元宇宙&#xff1a;应用与实践》、《香港Web3.0标准化白皮书》等标准&#xff0c;下面提供…...

LeetCode:206.反转链表

跟着carl学算法&#xff0c;本系列博客仅做个人记录&#xff0c;建议大家都去看carl本人的博客&#xff0c;写的真的很好的&#xff01; 代码随想录 LeetCode&#xff1a;206.反转链表 给你单链表的头节点 head &#xff0c;请你反转链表&#xff0c;并返回反转后的链表。 示例…...

详解高斯消元

详解高斯消元 好东西,可以求所有一次方程组的解。 \color {red} 好东西,可以求所有一次方程组的解。 好东西,可以求所有一次方程组的解。 前置知识 一般消元法的公理: 两方程互换,解不变; 一方程乘以非零数 k k k,解不变; 一方程乘以数 k k k加上另一方程,解不变。 …...

Maven - 优雅的管理多模块应用的统一版本号

文章目录 概述一、使用 versions-maven-plugin 插件1. 在主 pom.xml 中定义插件2. 修改版本号3. 回退修改4. 提交修改 二、使用占位符统一管理版本号1. 在主 pom.xml 中定义占位符2. 使用 flatten-maven-plugin 插件自动替换占位符3. 修改版本号4. 为什么这种方式更方便&#x…...

国际网络安全趋势

1. 亲近拥抱人工智能自动化。 随着安全协调、人工智能自动化和响应(SOAR)的日益普及&#xff0c;人工智能自动化开始成为现实并将继续扩展到其他安全行动领域。寻求将人工智能自动化整合到原有的工具中&#xff0c;通过将威胁情报整合在一起&#xff0c;将其转换为可用格式并主…...

基于米尔全志T527开发板的FacenetPytorch人脸识别方案

本篇测评由优秀测评者“小火苗”提供。 本文将介绍基于米尔电子MYD-LT527开发板&#xff08;米尔基于全志 T527开发板&#xff09;的FacenetPytorch人脸识别方案测试。 一、facenet_pytorch算法实现人脸识别 深度神经网络 1.简介 Facenet-PyTorch 是一个基于 PyTorch 框架实…...

Altium Designer脚本工具定制

原理图设计自动化 ➡️Altium原理图检查工具 ➡️元器件参数集导入导出 ➡️原理图符号自动创建 ➡️原理图高级查找 ➡️原理图库文档高级查找 ➡️原理图文档对比 ➡️原理图库文档对比 PCB设计自动化 ➡️各种各样的PCB线圈自动创建 ➡️PCB文档导出成SVG格式文档…...

贝锐自研智慧网关系统OrayOS升级,适配Banana PI开发板BPI-R3 Mini

为了满足多元化的应用场景&#xff0c;贝锐与Banana PI携手合作&#xff0c;贝锐自研新一代云智慧网关系统OrayOS不仅已成功适配BPI-R3&#xff0c;还进一步扩展至BPI-R3 Mini&#xff0c;提供了更丰富的选择。在全球工业物联网、视频监控管理以及企业级办公存储等领域&#xf…...

搭建环境-PHP简介及环境搭建教程

搭建环境-PHP简介及环境搭建教程 前言 在现代Web开发中,PHP是一种广泛使用的服务器端脚本语言,它以简洁、高效和跨平台的特性受到开发者的青睐。无论是小型网站还是大型企业应用,PHP都能提供强大的支持。本文将为您详细介绍PHP的基本概念、特点,以及如何搭建PHP开发环境。…...

Maven 配置

参考学习&#xff1a; eclipse&#xff08;或myeclipse&#xff09;通过maven配置连接neo4j_eclipse 链接 neo4j-CSDN博客 爆肝十小时—我终于用Java连上Neo4j数据库 - 知乎 全站最全Maven下载安装配置教学&#xff08;2024更新...全版本&#xff09;建议收藏...赠送IDEA配置Ma…...

js常见函数实现

文章目录 一、数组Array1、forEach2、filter3、map4、reduce5、find6、findIndex7、includes8、join 二、对象Object1、Object.keys2、深复制 js环境中有很多工具函数&#xff0c;比如es6添加了很多新的属性和方法&#xff0c;这些方法也可以自定义实现&#xff0c;但是官方也提…...

点云3DHarris角点检测算法推导

先回顾2D的Harris角点检测算法推导 自相关矩阵是Harris角点检测算法的核心之一&#xff0c;它通过计算图像局部区域的梯度信息来描述该区域的特征。在推导Harris角点检测算法中的自相关矩阵时&#xff0c;我们首先需要了解自相关矩阵的基本思想和数学背景。 参考 1. 能量函数…...

mysql-binlog的三种模式

MySQL的binlog&#xff08;二进制日志&#xff09;有三种主要模式&#xff0c;分别是Statement、Row和Mixed。这三种模式在记录数据库更改的方式上有显著的区别&#xff0c;以下是对这三种模式的详细解释及对比&#xff1a; 一、Statement模式&#xff08;基于SQL语句的复制&a…...

自动类型推导(auto 和 decltype);右值引用和移动语义

1) 自动类型推导&#xff08;auto 和 decltype&#xff09; 自动类型推导&#xff08;auto&#xff09; 在C11及以后的版本中&#xff0c;auto关键字被引入用于自动类型推导。这意味着编译器会自动推断变量的类型&#xff0c;基于其初始化的表达式。使用auto可以让代码更加简…...

(Linux 系统)进程控制

目录 一、进程创建 1、fork函数初识 二、进程终止 1、正常终止 2、异常终止 三、进程等待 1、进程等待必要性 2、进程等待的方法&#xff1a; 四、获取子进程status 1、基本概念 2、进程的阻塞等待方式 3、进程的非阻塞等待方式 五、进程程序替换 1、六种替换函数…...

【Nativeshell】flutter的pc跨平台框架学习记录<二> 窗口间通信

首先是初始化&#xff1a; 查看Nativeshell的demo代码 // ignore_for_file: undefined_hidden_name, // not in main import package:flutter/material.dart hide MenuItem; import package:nativeshell/nativeshell.dart;import pages/other_window.dart; import pages/plat…...

今日codeforces刷题(1)

一、前言 新栏目&#xff0c;每隔几天就保质保量地刷个10道codeforces题左右的样子 筛选1200-1500难度的题&#xff0c;然后按通过题目的人数降序排列的前10题 二、题目总览 三、具体题目 3.1 25A. IQ test 我的代码 看奇数出现的次数为1还是偶数出现的次数为1&#xff0c…...

【C++算法】20.二分查找算法_x 的平方根

文章目录 题目链接&#xff1a;题目描述&#xff1a;解法C 算法代码&#xff1a;图解 题目链接&#xff1a; 69. x 的平方根 题目描述&#xff1a; 解法 暴力解法&#xff1a; 如果x17 从1&#xff0c;2&#xff0c;3&#xff0c;4&#xff0c;5......这些数里面找他们的平方…...

图像显示的是矩阵的行和列,修改为坐标范围。

x 3; y 3; f1x x^2 y^2; guance1 f1x; F (x, y) sqrt((x.^2 y.^2 - guance1).^2); % 使用点乘 [x, y] meshgrid(0:1:5, 0:1:5); Z F(x, y); figure; imagesc(Z); % 由于 imagesc 使用矩阵索引作为坐标&#xff0c;我们需要手动添加刻度 % 这里我们假设 x 和 y 的范围…...

通义灵码走进北京大学创新课堂丨阿里云云原生 10 月产品月报

云原生月度动态 云原生是企业数字创新的最短路径。 《阿里云云原生每月动态》&#xff0c;从趋势热点、产品新功能、服务客户、开源与开发者动态等方面&#xff0c;为企业提供数字化的路径与指南。 趋势热点 &#x1f947; 通义灵码走进北京大学创新课堂&#xff0c;与 400…...

LeetCode Hot100 1~10

目录 哈希1. 两数之和2. 字母异位词分组3. 最长连续子序列 双指针4. 移动零5. 盛最多水的容器6. 三数之和7. 接雨水 子串8. 无重复字符的最长子串9. 找到字符中所有字母的异位词10. 和为K的子数组 哈希 1. 两数之和 利用哈希表找出当前数字还差多少 看看差值时候在哈希表中即…...

npm 最新国内淘宝镜像地址源 (旧版已不能用)

注意&#xff1a;原域名https://registry.npm.taobao.org/ 在 2022.06.30 号正式下线和停止 DNS 解析 最新地址&#xff1a; #最新地址 淘宝 NPM 镜像站喊你切换新域名啦! npm config set registry https://registry.npmmirror.com 查看镜像使用状态 npm config get registr…...

DepthAI 2.29版本 发布

2024年11月29日 增加在设备运行时使用新的 dai::Device.setCalibration() 更改设备校准能力的方法&#xff0c;并使用 dai::Device.getCalibration() 进行检索校准 1&#x1f343; 新的立体深度预设属性&#xff1a; 预设 面部 高细节 机器人 2&#x1f343; 多项摄像…...

C#反序列化XML时提示XML 文档(1, 1)中有错误

最近在反序列化一个XML时&#xff0c;遇到了如下报错&#xff1a; XML 文档(1, 1)中有错误。 内部异常 XmlException: 根级别上的数据无效。 第 1 行&#xff0c;位置 1。 看描述应该是XML格式的问题&#xff0c;我把XML复制到新建的控制台程序&#xff0c;反序列化又是可以的…...

C# 中的接口:定义行为契约与实现多态性

C#中的接口&#xff08;Interfaces&#xff09;。接口是C#中一个非常重要的特性&#xff0c;它允许定义类型的行为契约&#xff0c;而不指定具体实现。通过接口&#xff0c;可以实现多态性、代码的灵活性和可扩展性。以下是一篇关于C#中接口的文章。 引言 接口&#xff08;Int…...

怎么在wordpress建站/搜索引擎优化策略有哪些

Linux下 pthread mutex * PTHREAD_MUTEX_TIMED_NP&#xff0c;这是缺省值&#xff0c;也就是普通锁。当一个线程加锁以后&#xff0c;其余请求锁的线程将形成一个等待队列&#xff0c;并在解锁后按优先级获得锁。这种锁策略保证了资源分配的公平性。 * PTHREAD_MUTEX_RECURSIVE…...

web前端工程师面试自我介绍/seo推广怎么入门

使用NPOI时ICSharpCode.SharpZipLib版本冲突问题解决参考文章&#xff1a; &#xff08;1&#xff09;使用NPOI时ICSharpCode.SharpZipLib版本冲突问题解决 &#xff08;2&#xff09;https://www.cnblogs.com/fmgyes/p/9188964.html 备忘一下。...

添加到wordpress视频库中/什么是电商平台推广

0 结论 避免在整型和指针类型间重载&#xff0c;尽量使用nullptr代替空指针。 1 nullptr、NULL和0 一般情况下&#xff0c;人们经常习惯于使用0或NULL来代指空指针&#xff0c;这容易导致歧义或者程序编译错误。例如&#xff1a; 下面的代码中&#xff0c;f(NULL)会导致歧义…...

网站注册信息查询/旺道网站排名优化

#!/bin/bashecho -n Count:tput sccount0while true;doif [ $count -lt 40 ];thenlet count;sleep 1;tput rctput edecho -n $count;elseexit 0;fidone使用Shell实现一个倒计时&#xff0c; 其中&#xff0c;tput sc 是存储光标位置&#xff0c; tput rc 是恢复光标位置 tput …...

基础集团网站建设/惊艳的网站设计

选择宣传册的尺寸&#xff0c;是开始宣传册设计的第一步&#xff0c;宣传册印刷样式多种多样&#xff0c;做法千变万化&#xff0c;但是宣传册尺寸是宣传册的基调&#xff0c;最常规的规格主要有以下几种&#xff1a;1、最常规的宣传册印刷尺寸&#xff0c;适合绝大多数企业和场…...

游戏私服发布网站怎么做/小程序商城制作一个需要多少钱

uedtior errorhandler 配置文件加载失败 这个uedtior太扯淡了&#xff0c;在本地idea和tomcat上各种没问题&#xff0c;一上线就不能上传图片&#xff0c;我试过了网上说的各种方法都不管用。最后我用一个十分扯淡的方式解决了。 我的框架是springboot 在后端有ueditor包&…...