在Vim中正确的HTML属性高亮显示？

本文介绍了在Vim中正确的HTML属性高亮显示？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

当我在Vim中寻找适当的html标记时，我发现这个文章。但在查看romainl的答案（和他的截图）和html语法文件之后，我想知道如何在属性之后更改=（等号）的颜色以匹配属性的颜色而不更改html标签的颜色？

解决方案

探索 $ b

这是我在某处找到的一个非常有用的函数（很久以前，可能在Vim Wiki上），它为您提供了光标下的单词/符号的语法组：

  
 $ b 当光标位于 code>。
 
 
 一些替代/ cu stom语法文件可能会定义其他语法组，其名称略有不同，所以我的示例仅适用于我。您必须使用 SynStack（）来获取正确的语法组。

> Reflexion

使用我们迄今收集的信息，很明显，标签名称（ ['htmlTagName']] code>）可以独立于标签的其余部分进行样式设计，但似乎不能以不同的方式突出显示 = 。因为它是与<> 相同语法组的一部分，所以 = 必须突出显示。

我们有两种可能性：

a。 < ， = 和> 是相同的颜色而 div 是不同的。

b。 < ， div ， = 和<$ c $

原始主题遵循路径 a >我不喜欢，所以我不得不自定义它一些（路径 b ），在我回答上一个问题的时候用了几行：
hi htmlTag guifg =＃90b0d1 gui = NONE
hi htmlSpecialTagName guifg =＃90b0d1 gui = NONE
hi htmlTagName guifg =＃ 90b0d1 gui = NONE
hi htmlEndTag guifg =＃90b0d1 gui = NONE

事实上，使 = 不同于<> 的颜色是不可能的。如果我们要着色 = ，我们将编辑HTML语法文件和你的colorscheme，cowboy style。
>

动作

第一步是制作本地副本默认的HTMl语法文件：

$ cp /usr/share/vim/vim73/syntax/html.vim〜/。 vim / syntax / html.vim

下一步是编辑这个文件。我们将执行两项更改：

添加 htmlEqualSign 语法组

第44行应该是（注意！未经彻底测试）：

syn match htmlEqualSign contains=

add <$ c $ htmlTag group

第40行〜/ .vim / syntax / html.vim 应改为：

syn region htmlTag start = +< [^ /] + end = +> + contains = htmlTagN，htmlString，htmlArg，htmlValue，htmlTagError，htmlEvent，htmlCssDefinition，@ htmlPreproc，@ htmlArgCluster
pre>

到：

syn区域htmlTag start = +< [^ /] + end = +> + contains = htmlTagN，htmlString，htmlArg，htmlValue，htmlTagError，htmlEvent，htmlCssDefinition，@ htmlPreproc，@ htmlArgCluster，htmlEqualSign

最后一步是编辑您的colo rscheme，以便按照你想要的方式着色 = 。你可以在你的colorscheme的某处添加这一行：

hi htmlEqualSign guifg =＃00ff00

当然有您选择的颜色。

但我认为你想让 = 与 id 相同（这个问题在你的问题中不是很清楚）。为此，我们要将 htmlEqualSign 组链接到用于属性的组。同样，：调用SynStack（）非常有帮助：属性的语法组是 htmlArg ，所以要添加的行到你的colorscheme将是：

pre $ hi $ link $ html $ p>

While I was looking for proper html tag highlighting in Vim, I found this post. But after looking at romainl's answer (and his screenshot) and html syntax file, I wonder how can I change color of = (equal sign) after attribute to match the color of an attribute without changing html tag's color?

解决方案

Exploration
Here is a very useful function I've found somewhere (a long time ago, probably on the Vim Wiki) that gives you the syntax group of the word/symbol under your cursor:
```
function! SynStack()
    if !exists("*synstack")
        return
    endif
    echo map(synstack(line('.'), col('.')), 'synIDattr(v:val, "name")')
endfunc
```
Just place your cursor on the item you want to inspect and type :call SynStack() to echo the syntax group in the command-line.
If I place my cursor on the = in <div id="example"></div>, the output of SynStack() is ['htmlTag'].
With the cursor on <> I get ['htmlTag'] as well.
With the cursor on div I get ['htmlTag', 'htmlTagN', 'htmlTagName'] which means that the color of div (h1, p…) is defined via a special syntax group called htmlTagName that inherits from htmlTag.
Some alternative/custom syntax files may define other syntax groups with slightly varying name so my example is only valid for me. You'll have to play with SynStack() to get the correct syntax groups.
Reflexion
With the info we have gathered so far, it's obvious that the tag name (['htmlTagName']) can be styled independtly from the rest of the tag but it doesn't seem doable to highlight the = differently. Because it is part of the same syntax group as <>, the = will necessarilly be highlighted the same.
We have 2 possibilities:
a. <, = and > are the same colour while div is different.
b. <, div, = and > are all the same colour.
The original theme followed path a which I didn't like, so I had to customize it a little (path b) with the few lines in my answer to the previous question:
```
hi htmlTag            guifg=#90b0d1 gui=NONE
hi htmlSpecialTagName guifg=#90b0d1 gui=NONE
hi htmlTagName        guifg=#90b0d1 gui=NONE
hi htmlEndTag         guifg=#90b0d1 gui=NONE
```
As it is, having the = coloured differently than <> is not possible. If we want to colorize the = we are going to edit the HTML syntax file and your colorscheme, cowboy style.
Action
The first step is to make a local copy of the default HTMl syntax file:
```
$ cp /usr/share/vim/vim73/syntax/html.vim ~/.vim/syntax/html.vim
```
The next step is to edit this file. We are going to perform two changes:
1. add the definition of the htmlEqualSign syntax group
  Line 44 should be (Attention! Not thoroughly tested.):
```
syn match htmlEqualSign contained "="
```
2. add htmlEqualSign to the htmlTag group
  Line 40 of ~/.vim/syntax/html.vim should be changed from:
```
syn region htmlTag start=+<[^/]+ end=+>+ contains=htmlTagN,htmlString,htmlArg,htmlValue,htmlTagError,htmlEvent,htmlCssDefinition,@htmlPreproc,@htmlArgCluster
```
  to:
```
syn region htmlTag start=+<[^/]+ end=+>+ contains=htmlTagN,htmlString,htmlArg,htmlValue,htmlTagError,htmlEvent,htmlCssDefinition,@htmlPreproc,@htmlArgCluster,htmlEqualSign
```
The last step is to edit your colorscheme so that it colorizes = the way you want. You do that by adding this line somewhere in your colorscheme:
```
hi htmlEqualSign guifg=#00ff00
```
With the color of your choice, of course.
But I think that you want = to be the same color as id (that's not very clear from your question). For that, we are going to "link" the htmlEqualSign group to the one being used for attributes. Again, :call SynStack() is of great help: the syntax group for attributes is htmlArg so the line to add to your colorscheme would be:
```
hi link htmlEqualSign htmlArg
```

这篇关于在Vim中正确的HTML属性高亮显示？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

1403页，肝出来的..

在vim中

在Vim中正确的HTML属性高亮显示？

问题描述