使用webstorm快捷创建嵌套标签

最新推荐文章于 2024-05-15 02:33:57 发布
最新推荐文章于 2024-05-15 02:33:57 发布
阅读量3k 收藏 3
点赞数 3
分类专栏： 前端相关
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36711420/article/details/79665805
版权

使用pycharm快捷创建嵌套标签

今天无意中发现webstorm中创建嵌套标签竟然可以如此简单，怒记一波，希望可以帮到有需要的小伙伴

快捷创建真是爽爆了有没有

ul>li*5>a[name=”test”]>span{红红火火恍恍惚惚}
这里写图片描述

实际效果
这里写图片描述

爽爆了有没有！

下面就来讲解下用法
基本格式为
标签a>标签b
自动创建a包含b的标签结构

标签c*num
创建num个并列的标签c

标签[attr=”valve”]
添加标签属性-值,可以不写值，之后手动添加

标签{内容}
添加标签内容

其他的用法还有待挖掘，今天就总结这些
看到的小伙伴点个赞吧

qq_36711420
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
webstorm添加多个项目
weixin_30699443的博客
05-20 183
在webstorm工作目录下，添加其他项目，不用每个项目打开一个webstorm，刚开始使用webstorm的时候，每次打开一个项目的时，都要打开一个开发界面，在这几个窗口之间来回的切换，有一天真的感觉这太麻烦了，最后决定找一找方法，在找了很多以后，我发现这个方法有效，和大家一起分享一下，这样以后的开发中就不用每天对切换窗口了，工作效率也有了提高，不用瞎忙了，具体操作如下： 1.打开web...
webstorm快速输入标签
Cool的博客
07-26 4768
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>webstorm快键键</title> </head> <body> <
前端学习 webstorm ide快速输入html等标签_webstorm快捷输入标签(1)
最新发布
2401_85013639的博客
05-15 275
ul及3个li ul>li\*3。ul及1个li ul+input:button 加tab键。三个P标签：p\*3 加 tab。两个P标签：p+p 加 tab。嵌入式知识点，真正体系化！1个P标签：p 加 tab。
webstorm html设计表格,WebStorm学习HTML杂记
weixin_29530803的博客
06-05 487
option +拖拽鼠标:可以同时输入多行command + 左右键: 可以跳到行头行尾command+d:快速复制粘贴command+x :快速删除command+alt+t:选中文字插入标签文字过长自动换行:preferences->Editor->General之后找到Soft Wraps,选中Use soft wraps in editor注释:command+ /br标签 作...
WebStorm在选中文字左右两侧添加标签
Beeeeeea的博客
11-28 2127
在编写HTML的时候经常会遇到一个需求就是选中一段文字，然后在其左右两侧同时添加开合标签。 比如现在有 <div class="date-tag">4.12</div> 之后写css的时候发现因为某些原因需要把中间的4.12包裹在一个span内。 这个时候就可以选中4.12，按ctrl+alt+t，弹出如下菜单 菜单中的第3项就是我们想要的功能，可以用鼠...
使用webstorm开发nodejs中文WORD版
07-22
资源名称：使用webstorm开发nodejs 中文WORD版内容简介：本文档主要讲述的是使用webstorm开发nodejs；希望对大家会有帮助；感兴趣的朋友可以过来看看资源截图： 资源太大，传百度网盘了，链接在附件中，有需要的同学...
微信小程序中用WebStorm使用LESS
08-31
在 WebStorm 中，可以创建 LESS 文件，然后_associate_对应的 wxss 文件。在写好 LESS 文件并保存后，WebStorm 会自动刷新 wxss 文件。 最后，需要注意 LESS 语法的使用。在上面的示例代码中，我们可以看到使用 ...
使用webstorm实现个人简历网页
07-13
使用webstorm制作个人简历网页，拥有点击照片放大图片的功能。考虑个人信息安全问题，简历中汉字均用x代替，若有需要自行下载更改程序中汉字内容，即可使用。
webstorm2019版本创建VUE项目
01-20
在论坛里发现有小伙伴使用2019版本的webstorm创建VUE项目的时候失败了，突然一想我也是2019的，后来没创建过，于是我就试了一下，如图： 啊哈 什么东西，稀奇古怪的错误 不管他，先运行下试试看啥结果 哦豁，很...
Webstorm开发工具使用教程详解
10-14
主要为大家详细介绍了Webstorm使用教程的使用教程，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
web开发例子，html注释标签
m0_60146621的博客
07-23 138
javascript篇 一、数据类型 JavaScript 有几种类型 基本数据类型：undefined、null、boolean、number、string、symbol(es6的新数据类型) 引用数据类型：object、array、function(统称为object) 数据类型检测 typeof 对于基本数据类型来说，除了 null 都可以显示正确的类型，typeof 对于对象来说，除了函数都会显示 objec typeof 5 // 'number' typeof
Emmet语法(快速批量生成标签和样式)
weixin_50241387的博客
06-16 1246
目 录一、Emmet语法二、快速生成HTML结构语法三、快速生成CSS样式语法Emmet语法前身是Zen coding，它使用缩写来提高HTML/CSS的编写速度，VScode和Webstorm内部已经集成该语法。1. 生成标签直接输入标签名按tab键即可比如div然后tab键 ,就可以生成 2. 如果想要生成多个相同标签加上*就可以了比如div*8 就可以快速生成8个div3. 如果有父子级关系的标签,可以用>；比如：ul > li 就可以生成：4. 如果有兄弟(同级)关系的标签，.........
WebStorm常见自动补全方法以及快捷键
weixin_43451347的博客
08-10 5054
WebStorm常见自动补全方法以及快捷键 提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录WebStorm常见自动补全方法以及快捷键前言一、常见自动补全1. 标签 , 按Tab键2. 标签 + ' # ' + 地址名，按Tab键（标签 + 地址）3. 标签 + ' . ' + 类名, 按Tab键(标签 + 类)4. 标签 + ' > ' + 子标签 + ' * ' + 个数（标签 + 子标签 + 个数）5. 标签+类+地址+子标签+子标签个数+子子标签+[地址]+{文本}
HTML--简述、常用标签、列表标签、表单、表格标签、实体字符、块元素和行内元素
小白小白从不日别的博客
03-26 865
一、简述 HTML：超文本标记语言 超：代表超链接 超文本：指的是通过一系列的超链接，将不同空间里面的资源链接在一起，形成一个网状的可相互连接的结构。可以传递文字、图片、视频、音频等等。浏览器发送一次请求，服务器就可以响应多个资源。 标记（也称为标签）：例如<html></html> 其中第一个标签是开始标签，第二个标签是结束标签 <font color="red" size="5"> 通俗理解：在记事本当中，用标记写出来的一种计算机标记语言。 注意： HTML中所有的
HTML基础、列表、表格
m0_56832923的博客
03-03 533
HTML网页的基本结构 1.什么是HTML? 1）Hyper Text Markup Language(超文本标记语言)，是一种用来描述网页的标记语言。 2）HTML不是一种程序语言，不强调任何的逻辑性。 3）HTML是由一套标签组成： 双标签格式：<标签名称></标签名称> 例如：<body></body> 单标签格式：<标签名称/> 例如：<br/> 2.开发工具 记事本、EditPlus、sublime、WebStorm 3.基本
webstorm实用技巧
ScottePerk的博客
09-06 950
接着上面，实现上面功能的时候，可能忘记加href属性了，这时候还是可以使用行选择功能快速插入多行。到a标签中间的位置选中多行，ctrl+v就可以快速的把内容插入到a标签里面了。比如有下面的5行内容，每行内容都是不一样的。.div1+.div2+.div3,然后按tab可以快速生成下面的代码。.div1>div2>div3，然后按tab键可以快速生成下面的代码。现在我想把这些内容快速插入到下面的li标签里面的a标签里面。这个可以通过webstorm的行选择模式实现。选择多行，输入要插入的文本内容。
使用webStorm中html5的小入门基础
kaiqiang2pm的博客
06-23 1878
结构：（用过java eclipse的可以选择使用eclipse的快捷键） Title 2种元素类型 块元素: 前后换行,自占一行 可以嵌套行内元素,普通文本,块元素 行内元素:宽度由自身撑起 可以嵌套行内元素,普通文本 1. a 超链接标签(所有关键字都可只打一个单词再按Tab键自动补充，比如打a再按tab会自动补齐超链接标签） <a hr...
利用webstorm 快捷创建标签案例：
qq_45670012的博客
10-02 516
利用webstorm快捷创建标签案例： .wrapper>(.sWrapper>input[class='sText']+span[class= 'btn']*3)+.flWrapper>ul>...
使用webstorm创建vue项目
08-22
使用WebStorm创建Vue项目的步骤如下： 1. 打开终端，并运行以下命令安装Vue脚手架：npm install vue-cli -g 2. 然后在终端中切换到你想要创建Vue项目的文件夹，并运行以下命令：vue init webpack myproject1 （其中myproject1是你的项目名称） 3. 按照提示输入相关内容，比如项目名称、描述等。 4. 完成以上步骤后，Vue项目将被创建在指定的文件夹中。 另外，如果你希望在WebStorm中快速启动Vue项目，可以进行以下配置： 1. 打开WebStorm，点击顶部菜单栏的"File"，然后选择"Open"。 2. 在文件浏览器中选择你创建的Vue项目文件夹，点击"Open"按钮导入项目。 3. 导入项目后，WebStorm会自动检测到该项目的相关配置文件，并设置好Vue开发环境。 4. 接下来，你可以在WebStorm中编辑和修改Vue项目的代码。 5. 若要运行项目并调出控制台，可以使用WebStorm的内置功能，在顶部菜单栏中选择"Run"，然后选择"Run"或者按下快捷键"Ctrl + Shift + R"。 通过以上步骤，你就可以在WebStorm中创建和运行Vue项目了。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [用webstorm创建vue项目](https://blog.csdn.net/u014274590/article/details/84849474)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [使用webstorm来创建并且运行vue项目详细教程](https://blog.csdn.net/qq_36538012/article/details/88054170)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值