atom-text-editor::shadow .comment {
color: #ffffaa;
}
这很棒 – 现在我有明亮的黄色评论,要求被注意,而不是褪色到背景中.麻烦的是,它现在看起来像下面
您可以看到,注释的文本颜色已更改,但注释中的注释分隔符和链接保留为默认的几乎不可见的灰色,这看起来有点愚蠢.
我的问题是(1)如何改变这些项目的颜色,更重要的是(2)在哪里可以查找如何改变这些项目的颜色？
请注意,我不是网络程序员,不了解任何CSS或任何相关技术.因此,我正在寻找一个相当逐步的解决方案,而不是解决方案,例如,在this question的答案中,该答案假设在这些内容的内部工作中有相当大的背景.
解决方法
>使用光标来突出显示要检查的元素.我在这里跟着你的双斜杠(即一个评论)的例子.
>按Ctrl Alt Shift P(或OS X上的Cmd Alt P).一个弹出窗口会告诉你该元素的所有类.通常,这是我们感兴趣的通知的最后一行.对于//,它是comment.line.double-slash.js.
>忽略最后一个点和其后的所有内容,因为保留它将仅将更改应用于特定文件类型(在这种情况下为js).现在加一个点.剩下的字符串是我们要样式的元素：.comment.line.double-slash.
通过打开命令面板打开.atom / styles.less(在Windows / Linux上的Ctrl Shift P或OSX上的Cmd Shift P)并搜索“应用程序：打开样式表”.
将这些行附加到.atom / styles.less,如果尚未存在：
atom-text-editor::shadow {
// custom comment styling goes here
}
在括号内,您可以为要自定义的任何元素放置CSS / LESS代码.
atom-text-editor::shadow {
.comment.line.double-slash {
color: #ffffaa;
}
}
附加建议：如果应用相同的更改,可以枚举元素标识符作为逗号和空格分隔的列表.所以如果你想使链接与评论相同的颜色,有两种可能性：
.comment.line.double-slash {
color: #ffffaa;
}
.markup.underline.link.hyperlink { // I removed the '.https' to apply this to all protocols
color: #ffffaa;
}
要么
.comment.line.double-slash,.markup.underline.link.hyperlink {
color: #ffffaa;
}
在这里使用长类名称,我更喜欢第一个可读性选项.但这取决于你的选择.
