velocity模板html格式缩进问题

elocity中常常会写出#foreach #if #else #end等语句，
但由于模板文件中html本身就带有缩进，所以最终的缩进，并不符合velocity语句的含义。当主要针对velocity逻辑阅读时，很不方便

没有处理格式代码：

模板代码：

模板代码截图

生成html文件截图：

#if产生缩进后的截图

解决办法：

“#if#foreach#else#end”这些语法，不用任何缩进。并且行尾加##注释，表示不解析后面空格

定格写，末尾加##注释

取消缩进后结果

velocity-wiki地址

https://cwiki.apache.org/confluence/display/velocity/VelocityWhitespaceTruncatedByLineComment

解决办法截图

于具有很多属性的标签，我希望在新行上分割每个属性，当按Enter键调用新行时，它应该只缩进一个标签。

以下示例输出我想如何缩进我的属性：

<svg width="300px" height="150px">
 <ellipse class="fill-current" 
 cx="150" 
 cy="75" 
 rx="100"
 ry="75"
 />
</svg>

但PHPStorm会自动尝试将我所有的行缩进到当前属性：

<svg width="300px" height="150px">
 <ellipse class="fill-current"
 cx="150"
 cy="75"
 rx="100"
 ry="75"
 />
</svg>

我无法在设置（编辑器 - >代码样式 - > HTML）中找到任何选项来更改此行为。有谁知道这个问题的解决方案？

这背后的原因是因为我经常在我的HTML模板中使用自定义标签。有时候我自己的标签很长，并且是2个或（罕见的情况下）3个单词的组合，并且在新行上启动所有额外属性并且它不应该在标签的末尾对齐。自己缩进属性是很麻烦的。我想自动化它。

天来说下HTML语言CSS样式字体的文本缩进 text-indent

text-indent属性用来指定文本的第一行的缩进，通常是将段落的首行缩进。来看下语法使用:

div {

text-indent:10px;

}

来看下使用效果,使用前:

每一行没有缩进

使用后:

每个段落的第一行都缩进了20px，具体代码如下:

<!DOCTYPE html>

<head>

<title>CSS样式之文本缩进</title>

<style>

p {

text-indent: 20px;

}

</style>

</head>

<body>

<p>第一年，我考上了大学，来到了北京,冬天的雪就像冷冷的冰雨，

在脸上胡乱的拍.摇啊摇，摇啊摇，摇到外婆桥,从此世人眼中的你就像超人一样屹立于天地间。

</p>

<p>一片冰心在玉壶，我劝天公重抖擞，不拘一格降人才。一片冰心在玉壶，我劝天公重抖擞，不拘一格降人才。</p>

<p>只有聆听你的声音，才能抚平我寂寞无聊的心，HTML5。只有聆听你的声音，才能抚平我寂寞无聊的心，HTML5</p>

</body>

</html>

需要缩进的像素可以是任意值，除了正的px,还可以是负的值，可以看下效果:

这不是我的浏览器坏了，展示不了段落首部，是将px修改为-20px

具体代码如下:

<!DOCTYPE html>

<head>

<title>CSS样式之文本缩进</title>

<style>

p {

text-indent: -20px;

}

</style>

</head>

<body>

<p>第一年，我考上了大学，来到了北京,冬天的雪就像冷冷的冰雨，

在脸上胡乱的拍.摇啊摇，摇啊摇，摇到外婆桥,从此世人眼中的你就像超人一样屹立于天地间。

</p>

<p>一片冰心在玉壶，我劝天公重抖擞，不拘一格降人才。一片冰心在玉壶，我劝天公重抖擞，不拘一格降人才。</p>

<p>只有聆听你的声音，才能抚平我寂寞无聊的心，HTML5。只有聆听你的声音，才能抚平我寂寞无聊的心，HTML5</p>

</body>

</html>

根据大家写文章段落的习惯，一般都是缩进两个字，但是20px或者10px是不是2个字的长度呢，回答不是的。缩进字数长度有专门的单位: em

通过设置该属性，所有元素的第一行都可以缩进一个给定的长度，甚至该长度可以是负值。

em是一个相对单位，就是当前元素 font-size 1个文字的大小，如果当前元素没有设置大小，则会按照1个父元素文字大小。

我们来看下效果:

确实是缩进了2个字的长度，看下对应代码:

<!DOCTYPE html>

<head>

<title>CSS样式之文本缩进</title>

<style>

p {

text-indent: 2em;

}

</style>

</head>

<body>

<p>第一年，我考上了大学，来到了北京,冬天的雪就像冷冷的冰雨，

在脸上胡乱的拍.摇啊摇，摇啊摇，摇到外婆桥,从此世人眼中的你就像超人一样屹立于天地间。

</p>

<p>一片冰心在玉壶，我劝天公重抖擞，不拘一格降人才。一片冰心在玉壶，我劝天公重抖擞，不拘一格降人才。</p>

<p>只有聆听你的声音，才能抚平我寂寞无聊的心，HTML5。只有聆听你的声音，才能抚平我寂寞无聊的心，HTML5</p>

</body>

</html>

每个段落第一行如果想要三个字间距，就是3em

今天就先到这里，大家周末快乐~

在线咨询

上一篇：JavaScript代码怎样引入到HTML中？
下一篇：免费的网页版excel：x-sheet入门指南

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商

velocity模板html格式缩进问题

您的项目需求