CSS中首字母大写怎么实现?日常生活中需求方对英文的要求比较多,有的时候需要让英文单词或拼音首个字母大写;有的时候需要让全文中英文单词全大写或小写。这时候我们就需要text-transform属性了。好了废话不多说,直接看例子吧。

CSS代码:

/*首字母大写*/
.a {text-transform:capitalize;}
/*全都是大写*/
.b {text-transform:uppercase;}
/*全都是小写*/
.c {text-transform:lowercase;}

HTML代码:

<div class="a">
首字母大写→ni hao hello
</div>
<div class="b">
字母全实现大写→ni hao hello
</div>
<div class="c">
字母全实现小写→ni HAo hEllo
</div>

预览效果:

CSS中使用text-transform实现首字母大写的更多相关文章

  1. CSS实现英文或拼音单词首字母大写

    CSS实现英文或拼音单词首字母大写,只需要在css样式中加入: text-transform: capitalize 即可. 测试代码如下: <!doctype html> <htm ...

  2. 120、Java中String类之实现首字母大写

    01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...

  3. JS中将字符串中每个单词的首字母大写化

    今天看到一个帖子,处理js中字符串每个单词的首字母大写. 原贴地址:关于字符串中每个单词的首字母大写化问题 受到启发,自己跟着改写了几个版本如下,请大家指正. 1.for循环: var a = 'Hi ...

  4. text-transform设置单词首字母大写

    text-transform 一.语法   text-transform 主要用于设置文本的大小写. text-transform有5个值,分别如下: none. 默认值. capitalize. 文 ...

  5. Css中如何使英文和拼音变成全大写、全小写和首字母大写?

    想要实现英文和中文拼音变成全大写.全小写和首个字母大写,需要用到 css中text-transform样式属性,接下来介绍一下 1.text-transform的值 1)Capitalize:英文拼音 ...

  6. css中zoom和transform:scale的区别

    css中zoom和transform:scale的区别 关于zoom: 以前只是看到别人的代码中用过zoom,自己从未使用过,今天在探究ie7兼容inline-block时,发现里面提到了zoom.下 ...

  7. (转载)delphi中获取汉字的拼音首字母

    delphi中获取汉字的拼音首字母1.py: array[216..247] of string = ({216}'CJWGNSPGCGNESYPB' + 'TYYZDXYKYGTDJNMJ' + ' ...

  8. 小tips:JS/CSS实现字符串单词首字母大写

    css实现: text-transform:capitalize; JS代码一: String.prototype.firstUpperCase = function(){ return this.r ...

  9. CSS通过text-transform实现大写、小写和首字母大写转换

    再日常项目中可能会用到一些特殊的样式,比如大写字母转小写.小写字母转大写.首字母大写等. 可以通过 CSS 的 text-transform 属性来实现: text-transform 转换不同的文本 ...

随机推荐

  1. 每天写点shell——read的用法

    1.read基本读取 #!/bin/bash #testing the read command echo -n "Enter you name:" #echo -n 让用户直接在 ...

  2. java 解 poj 1000

    import java.util.Scanner; public class A1000 { public static void main(String[] args) { Scanner sc=n ...

  3. easyUI中onLoadSuccess方法获取多个对象

    后台将一个list中的对象循环放到map中,如下: @RequestMapping("/getSaleOrderDetailList") @ResponseBody public ...

  4. PHP 位运算(&, |, ^, ~, <<, >>)及 PHP错误级别报告设置(error_reporting) 详解

    位运算符允许对整型数中指定的位进行求值和操作. 位运算符 例子 名称 结果 $a & $b And(按位与) 将把 $a 和 $b 中都为 1 的位设为 1. $a | $b Or(按位或) ...

  5. React Native踩坑Tip

    最近在使用React Native(以下简称RN)中踩了个坑,RN只能异步调用原生方法,所以在原生方法直接调用UI刷新操作需要将任务递交到主线程才可以. RCT_EXPORT_METHOD(finis ...

  6. jquery 页面滚动到底部自动加载插件集合

    很多社交网站都使用无限滚动的翻页技术来提高用户体验,当你页面滑到列表底部时候无需点击就自动加载更多的内容.下面为你推荐 10 个 jQuery 的无限滚动的插件: 1. jQuery ScrollPa ...

  7. 耿丹CS16-2班第七次作业汇总

    Deadline: 2016-11-27 11:59pm 作业内容 第七次作业总结 01.每次成绩发布,麻烦没交作业的同学(暂定得分为-5的),请及时补交: 02.想不出来可以,代码乱成一团不行,命名 ...

  8. PPM图片格式及其C读写代码

    PPM图像格式介绍 PPM图像格式是由Jef Poskanzer 大叔,在我出生那一年,也就是1991年所创造的,碰巧的是PPM也是天蝎座. PPM(Portable Pixmap Format)还有 ...

  9. AxureRp 打开SVN上的团队项目

    打开Axure,在菜单项中,点击 "团队" 菜单,选择 "获取团队项目": 切换到 "SVN" 选项, 填写正确的Axure项目的路径,打开 ...

  10. Entity Framework 简单查询

    前言 首先来简单的复习一下如何使用Code First. 第一步还是先建立一个控制台的应用程序,然后通过Nuget添加Entity Framework.那么同时会给packages.config和Ap ...