CSS目标所有文本转换:大写?

时间:2015-11-11 10:07:35

标签: javascript css

我想知道是否有一种定位所有文字的方法:

text-transform: uppercase;

这里的想法是,排版方面,如果你使用全部大写,你应该增加字母间距的易读性,并且它只是针对所有大写文本而不是添加字母间距非常有用属性为每个具有变换的类:大写。

CSS或SASS可以实现吗?

2 个答案:

答案 0 :(得分:3)

简单回答:,CSS无法检测是否在DOM中设置了样式属性。但是您可以使用JS检查CSS属性,这些属性可以与DOM一起使用。

代码段:



var uppercased = document.querySelector('.texta');
var property = window.getComputedStyle(uppercased).getPropertyValue('text-transform');
if (property == 'uppercase') {
  uppercased.style.letterSpacing = '3px';
};

.texta {
  text-transform: uppercase;
}

<div class="texta">Text A</div>
<div class="textb">Text B</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

CSS或SASS无法实现,但您可以像这样使用jQuery:

$('*').filter(function() {
    return $(this).css('text-transform') == 'uppercase';
}).css('letter-spacing','1.1em');