HTML代码简写法:Emmet和Haml

HTML代码写起来很费事,因为它的标签多。

一种解决方法是采用模板, 在别人写好的骨架内,填入自己的内容。还有一种就是我今天想要介绍的方法----简写法。

常用的简写法,目前主要是Emmet和Haml两种,本文都将加以介绍。

这两种简写法,功能相近,各有特点。考虑到Haml基于Ruby语言,我建议Ruby/Rails项目使用Haml,其他项目使用Emmet。

时间: 2024-09-08 11:26:10

HTML代码简写法:Emmet和Haml的相关文章

WinForm 自动完成控件实例代码简析_C#教程

在Web的应用方面有js的插件实现自动完成(或叫智能提示)功能,但在WinForm窗体应用方面就没那么好了. TextBox控件本身是提供了一个自动提示功能,只要用上这三个属性: AutoCompleteCustomSource:AutoCompleteSource 属性设置为CustomSource 时要使用的 StringCollection. AutoCompleteMode:指示文本框的文本完成行为. AutoCompleteSource:自动完成源,可以是 AutoCompleteSo

JavaScript 三种不同位置代码的写法_javascript技巧

下面列举在三种不同的地方写JavaScript代码,实现的效果都是点击按钮button弹出alert警告框 第一种是最常见的,代码如下 html代码 <input type="button" value="按钮1" id="btn1" onclick="pop()"> js代码 function pop() { alert("在JavaScript函数处调用"); } 第二种是最简单的实现方式,

各种语言版本的301转向代码的写法

一: IIS中实现301转向: 1.打开internet信息服务管理器,在欲重定向的网页或目录上按右键 2.选中"重定向到URL" 3.在对话框中输入目标页面的地址 4.选中"资源的永久重定向" 5.点击"应用"即可生效 二:ASP下的301转向代码: ASP下的301转向代码: <%@ Language="VBScript" %> <% Response.Status = "301 Moved P

标准的css代码顺序写法

书写顺序和浏览器解析过程有关!浏览器先对dom定位,然后解析自身属性,然后再解析内部对象!//显示属性displaylist-stylepositionfloatclear //自身属性widthheightmarginpaddingborderbackground //文本属性colorfonttext-decorationtext-alignvertical-alignwhite-spaceother textcontent

PHP中几个可以提高运行效率的代码写法、技巧分享_php实例

废话不多说,直接看代码示例. 一.遍历数组 在遍历数组中注意count的使用次数,不要每次都去计算数组长度 效率慢的写法 复制代码 代码如下: <?php   $array = array(1,2,3,4,5,6,7,8,9,10,....); for($i=0;$k<count($array);$i++){     echo $array[$i]; }   ?> 效率快的写法 复制代码 代码如下: <?php   $array = array(1,2,3,4,5,6,7,8,9,

使用brackets来做,写html,js代码,下载emmet插件快速写代码,切图工的好帮手

brackets是adobe的开源产品,是一款用来写html,js的工具是切图工的好帮手,支持实于预览,当然现在限于google的chrome浏览器,我使用的是windows.041的版本 下载下来后一转换成中文的界面,语言包是内置的 然后需要下载一个插件,才能发挥出它的最大的长处 最经常使用一个就是emmet 如果要写出这样的代码使用的emmet的语法就是     <div class="part1">         <div class="leftp&

简化常用的CSS属性代码,让你的CSS更精简清晰

简化CSS属性代码,可以让CSS文件体积变得更小,读取速度更快,可维护性更高. 下面分别示例最常用的一些CSS属性代码的简化方法: marginmargin-top:1px;margin-right:1px;margin-bottom:1px;margin-left:1px;代码简化为:margin:1px margin-top:1px;margin-right:2px;margin-bottom:1px;margin-left:2px;代码简化为:margin:1px 2px margin-t

网站优化细节处理流程一:网站代码篇

在网站优化过程中,许多的站长都一味的追求外链建设和排名的追逐,大部分时候都把一些细节方面的因素都给忽略掉了,特别是在优化排名中,大部分站长认为好排名主要是靠外链,每天都在发外链.做外链,把自己当成是一个外链制造机.相对而言,一些细节方面的就没空处理了.难道真的外链就是排名的唯一要素吗?笔者不赞同,优化取胜之道,其中更多的则是靠细节方面的取胜.今天笔者给大家讲解一下细节方面的优化处理之网站代码篇. 一.Javascript代码 众所周所,在搜索引挚优化中,搜索引挚还不能识别JS代码里面的内容,也就

jQuery中$(document).ready()的特殊写法

看书时注意到下面两条语句的功效是相同的, $(function(){alert("hello!");}); $(document).ready(function(){alert("hello!");}); 这个特殊写法就是用$()代替$(document).ready(),类似于(有差异)window.onload弹出个窗口: 查看jQuery1.8.3源代码,是这样封装的: (function( window, undefined ) { /*...jQuery源