这是我的HTML:
<a href="#" class="link">small caps</a> &
<a href="#" class="link">ALL CAPS</a>
这是我的CSS:
.link {text-transform: capitalize;}
输出为:
Small Caps & ALL CAPS
我希望输出是:
Small Caps & All Caps
有什么想法吗?
发布于 2010-08-13 03:26:02
CSS无法做到这一点,你可以使用PHP或Javascript来实现这一点。
PHP示例:
$text = "ALL CAPS";
$text = ucwords(strtolower($text)); // All Caps
jQuery示例(现在它是一个插件!):
// Uppercase every first letter of a word
jQuery.fn.ucwords = function() {
return this.each(function(){
var val = $(this).text(), newVal = '';
val = val.split(' ');
for(var c=0; c < val.length; c++) {
newVal += val[c].substring(0,1).toUpperCase() + val[c].substring(1,val[c].length) + (c+1==val.length ? '' : ' ');
}
$(this).text(newVal);
});
}
$('a.link').ucwords();
发布于 2013-04-30 07:09:16
使用.toLowerCase()
和capitalize
进行JavaScript转换可以完成剩下的工作。
发布于 2010-08-13 03:23:16
captialize
只影响单词的第一个字母。http://www.w3.org/TR/CSS21/text.html#propdef-text-transform
https://stackoverflow.com/questions/3471157
复制相似问题