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. C# 管道通信 （client —— server）Framework2.0版本也可用

    //管道服务类public class PipServer { [DllImport("kernel32.dll", SetLastError = true)] public st ...

  2. .net core 2.1 Swagger 配置

    1.先创建 .net core Web 应用程序,选择API 2.安装 Nuget 包:Swashbuckle.AspNetCore Install-Package Swashbuckle.AspNe ...

  3. 基于JWT的Token登录认证

    1.JWT简介   JSON Web Token(缩写 JWT),是目前最流行的跨域认证解决方案. 2.JWT的原理        JWT的原理是,服务器认证以后,生成一个JSON格式的对象,发回给客 ...

  4. 文件操作NIO

    在丑陋的 Java I/O 编程方式诞生多年以后,Java终于简化了文件读写的基本操作. 两个基本组件 文件或者目录的路径: 文件本身. 这块基本都是些记忆性的东西,没什么过多的需要写的地方,用的时候 ...

  5. Codeforces Round #606 (Div. 2)

    传送门 A. Happy Birthday, Polycarp! 签到. Code /* * Author: heyuhhh * Created Time: 2019/12/14 19:07:57 * ...

  6. 0day2安全——笔记4(修改临界变量)

    第二章 修改临界变量 #include <stdio.h> #include <string.h> #define PASSWORD "1234567" i ...

  7. JS---DOM---为元素解除绑定事件

    解除绑定事件: 1.解绑事件 对象 .on 事件名字=事件处理函数--->绑定事件. 对象 .on 事件名字 = null . 注意:用什么方式绑定事件,就应该用对应的方式解除绑定事件. //1 ...

  8. Leetcode 90. 子集 II

    地址  https://leetcode-cn.com/problems/subsets-ii/ 给定一个可能包含重复元素的整数数组 nums,返回该数组所有可能的子集(幂集). 说明:解集不能包含重 ...

  9. poj 3253 Fence Repair 贪心 最小堆 题解《挑战程序设计竞赛》

    地址 http://poj.org/problem?id=3253 题解 本题是<挑战程序设计>一书的例题 根据树中描述 所有切割的代价 可以形成一颗二叉树 而最后的代价总和是与子节点和深 ...

  10. python执行cmd命令

    os.system os.system用来执行cmd指令,在cmd输出的内容会直接在控制台输出,返回结果为0表示执行成功 注意:os.system是简单粗暴的执行cmd指令,如果想获取在cmd输出的内 ...