text-transform属性介绍

  • text-transform属性就是设置HTML页面中的标签里面的文本大小写，text-transform属性常用的属性值有三种：capitalize、uppercase、lowercase，不常用的属性值在这笔者就不进行一一说明了。

text-transform属性值说明表

属性值 描述
none 默认。定义带有小写字母和大写字母的标准的文本。
capitalize 将英文字母的首字母设置为大写。
uppercase 将英文字母设置为大写。
lowercase 将英文字母设置为小写。
inherit 规定应该从父元素继承 text-transform 属性的值。

capitalize首字母设置为大写。

  • 让我们进入text-transform属性的属性值为capitalize实践，实践内容如：笔者将HTML页面中的h2标签中的文本首字母设置为大写。

  • 代码块

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>设置文本的大小写</title>

    <style>

        h2{

            text-transform: capitalize;

        }

    </style>

</head>

<body>

    <h2>success is not defeating others, but changing yourself</h2>

</body>

</html>

  • 结果图

uppercase文本设置为大写。

  • 让我们进入text-transform属性的属性值为uppercase实践，实践内容如：笔者将HTML页面中的h2标签中的文本小写的英文设置为大写。

  • 代码块

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>设置文本的大小写</title>

    <style>

        h2{

            text-transform: uppercase;

        }

    </style>

</head>

<body>

    <h2>success is not defeating others, but changing yourself</h2>

</body>

</html>

  • 结果图

lowercase文本设置为大写。

  • 让我们进入text-transform属性的属性值为lowercase实践，实践内容如：笔者将HTML页面中的h2标签中的文本大写的英文设置为小写。

  • 代码块

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>设置文本的大小写</title>

    <style>

        h2{

            text-transform: lowercase;

        }

    </style>

</head>

<body>

    <h2>SUCCESS IS NOT DEFEATING OTHERS, BUT CHANGING YOURSELF</h2>

</body>

</html>

  • 结果图

总结

  • text-transform属性只对英文起作用，不支持中文哦。

如何在HTML中设置文本的大小写的更多相关文章

  1. 如何在 apache 中设置缓存有效时间

    今天学习了下如何在 apache 中设置缓存时间,记之以备忘. 在 http 报文头中,与缓存时间有关的两个字段是 Expires 以及 Cache-Control 中的 max-age,Expire ...

  2. 如何在Eclipse中设置默认的JSP文件头部编码

    如何在Eclipse中设置默认的JSP文件头部编码 一般,我们为了以后在导入和导出程序的时候(特别是项目较大,文件多)一般都默认文件编码格式为UTF-8 如果你通常都是通过Eclipse来编写程序,那 ...

  3. 如何在IIS中设置HTTPS服务

    文章:https://support.microsoft.com/en-us/help/324069/how-to-set-up-an-https-service-in-iis 在这个任务中 摘要 为 ...

  4. SPSS输出结果如何在word中设置小数点前面显示加0

    SPSS输出结果如何在word中设置小数点前面显示加0 在用统计分析软件做SPSS分析时,其输出的结果中,如果是小于1(绝对值)的数,那么会默认输出不带小数点的数值.例如0.362和 -0.141被显 ...

  5. 如何在XAMPP中设置多个网站

    xampp 是一个非常方便的本地 apache + php + mysql 的调试环境,在本地安装测试 WordPress 等各种博客.论坛程序非常方便.今天我们来给大家介绍一下,如何使用 XAMPP ...

  6. 如何在BIOS中设置RAID？

    随着价格的下降和相应主板的支持,目前SATA硬盘已经逐渐成为主流.但由于受芯片组和操作系统的影响,不少用户对SATA硬盘的使用及安装系统掌握不足,今天小编就给大家介绍一下SATA硬盘的日常应用技巧,希 ...

  7. 如何在SpriteBuilder中设置对象的通用属性

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 我们知道在SpriteBuilder中可以为对象设置自定义类从 ...

  8. 如何在 Windows 中设置 /3GB 启动开关

    备注: 只有在下列操作系统中才支持 /3GB 开关: Windows 2000 Advanced Server Windows 2000 Datacenter Server Windows Serve ...

  9. 如何在IDM中设置代理服务器？

    很多时候,大家下载文件都是在国外的一些网站上进行下载,这样不可免会受到自身国内网络的限制,另一方面下载源为避免服务器带宽占用过多而限制下载速率,这就会导致文件下载极慢,甚至几KB每秒. 这种情况是不是 ...

随机推荐

  1. NIO中Buffer的重要属性关系解析

    Buffer 是java NIO中三个核心概念之一 缓存, 在java的实现体系中Buffer作为顶级抽象类存在 简单说,Buffer在做什么? 我们知道,在java IO中体系中, 因为InputS ...

  2. ASP.NET Core 2.2 WebApi 系列【一】搭建ASP.NET Core WebApi项目

    一.步骤 从“文件”菜单中选择“新建”>“项目” . 选择“ASP.NET Core Web 应用程序”模板,再单击“下一步” . 将项目命名为 NetCoreWebApi,然后单击“创建” . ...

  3. Java开发人员必备十大工具

    Java世界中存在着很多工具,从著名的IDE(例如Eclipse,NetBeans和IntelliJ IDEA)到JVM profiling和监视工具(例如JConsole,VisualVM,Ecli ...

  4. CSS 让div,span等块级、非快级元素排列在同一行

    让div,span等块级.非快级元素排列在同一行 by:授客 QQ:1033553122 例子:让两个div排列在同一行 给div添加float样式 <!DOCTYPE html> < ...

  5. 最常见的 Git 问题和操作清单汇总

    最常见的 Git 问题和操作清单汇总 引言 本文整理自工作多年以来遇到的所有 Git 问题汇总,之前都是遗忘的时候去看一遍操作,这次重新整理了一下,发出来方便大家收藏以及需要的时候查找答案. 一.必备 ...

  6. dubbo解决本地开发直连

    问题: 在如今的分布式项目开发中,zookeeper + dubbo是最常见的,通常的使用是用zookeeper做注册中心,dubbo做rpc,然后服务部署就可以实现相互之间的远程通信.所以开发项目时 ...

  7. JVM java内存区域的介绍

    jvm虚拟机在运行时需要用到的内存区域.广泛一点就是堆和栈,其实不然,堆和栈只是相对比较笼统的说法,真正区分有如下几个 先上图一: 总的就是 java的内存模型 内存模型又分堆内存(heap)和方法区 ...

  8. JUC-3-ConcurrentHashMap

    ConcurrentHashMap 锁分段机制  JDK1.8

  9. ASA 笔记

    show logging 缓存日志FW(config)# show run route 查看路由 FW(config)# ip verify reverse-path interface Outsid ...

  10. python中可变与不可变类型的全局变量

    python中的不可变类型的全局变量如int  a=1,str  b='hello', 若需要修改必须加global申明, 而全局变量是可变类型的,如list, dict ,则直接修改list.app ...