html 快捷输入代码

最新推荐文章于 2023-04-11 20:58:10 发布

XXXefiskksadfalf

最新推荐文章于 2023-04-11 20:58:10 发布

阅读量741

点赞数 3

文章标签： html html5

本文链接：https://blog.csdn.net/miiiiiiiiiiiii/article/details/120588344

版权

快捷输入代码

// 输入
html:5

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

// 输入
div*数量如 div *3

// 回车
<div></div>
<div></div>
<div></div>

// 输入
div>li*数量如 div>li *3

// 回车
<div>
    <li></li>
    <li></li>
    <li></li>
</div>

// 输入生成带有文字(文本,内容) 的标签
div{文本} 如 div{我是程序猿}
div*数量{文本} 如 div *3{我是程序猿}

// 回车
<div>我是程序猿</div>

// 回车，生成多个
<div>我是程序猿</div>
<div>我是程序猿</div>
<div>我是程序猿</div>

// 输入使用 “ [] ” 标记其他属性
生成单行：
td[title=‘hello’ colspan=3]

// 回车
<td title="hello" colspan="3"></td>

// 输入生成带有属性和属性值的标签
生成单行：
div[class=“title”] 如 div{我是程序猿}
div*数量[class=“title”] 如 div *3{我是程序猿}

// 回车
<div calss="title"></div>

// 回车，生成多个
<div>我是程序猿</div>
<div>我是程序猿</div>
<div>我是程序猿</div>

生成包含：
div>class.title
div>class.title*3 多个

// 回车
<div>
    <class class="title"></class>
</div>

// 回车，生成多个
<div>
    <class class="title"></class>
    <class class="title"></class>
    <class class="title"></class>
</div>

// 输入

div>ul>li

// 回车
<div>
    <li>
        <ul></ul>
    </li>
</div>

// 输入，使用“+”生成兄弟元素

div+p+bq
> blockquote,块引用。默认表现为左右两侧缩进的文本。

// 回车
<div></div>
<p></p>
<blockquote></blockquote>

// 输入，使用 “ ^ ”生成父元素

div+div>p>span+em^bq
> 使用 ^ ，必须在 p 标签中并包含 span 或 em 标签时生效
如 div>p>span^ bq 或 div>p>em^bq

// 回车
<div></div>
<div>
    <p><span></span><em></em></p>
    <blockquote></blockquote>
</div>

// 输入，使用 “ () ” 将元素分组

div>(header>ul>li*2)+footer>p

// 回车
<div>
    <header>
        <ul>
            <li></li>
            <li></li>
        </ul>
    </header>
    <footer>
        <p></p>
    </footer>
</div>

输入属性的操作

》 id 与 class
id 属性值用 # ；class 属性值用 •

// 输入

div#header+div.page+div#footer.classtext

// 回车
<div id="header"></div>
<div class="page"></div>
<div id="footer" class="classtext"></div>

// 输入用“$”符号自动编号（“*”实现多个元素）
生成单行：
li.item $*3

// 回车
<li class="item1"></li>
<li class="item2"></li>
<li class="item3"></li>

// 输入，用“ {} ”添加文本内容
生成单行：
a[href=me.htm]{click me}

// 回车
<a href="me.htm">click me</a>

XXXefiskksadfalf

关注

3
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
html 快捷输入代码

快捷输入代码 // 输入 html:5 // 回车<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=.
复制链接

扫一扫