CSS文字转换大写

这是我的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

有任何想法吗?


芜湖不芜
浏览 1068回答 3
3回答

湖上湖

CSS无法做到这一点,您可以为此使用PHP或Javascript。PHP示例:$text = "ALL CAPS";$text = ucwords(strtolower($text)); // All CapsjQuery示例(现在是插件!):// Uppercase every first letter of a wordjQuery.fn.ucwords = function() {&nbsp; return this.each(function(){&nbsp; &nbsp; var val = $(this).text(), newVal = '';&nbsp; &nbsp; val = val.split(' ');&nbsp; &nbsp; for(var c=0; c < val.length; c++) {&nbsp; &nbsp; &nbsp; newVal += val[c].substring(0,1).toUpperCase() + val[c].substring(1,val[c].length) + (c+1==val.length ? '' : ' ');&nbsp; &nbsp; }&nbsp; &nbsp; $(this).text(newVal);&nbsp; });}$('a.link').ucwords();

手掌心

您几乎可以做到:.link { text-transform: lowercase; }.link:first-letter { text-transform: uppercase; }它将为您提供输出:Small capsAll caps
打开App,查看更多内容
随时随地看视频慕课网APP