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. slave_master_info和slave_relay_log_info中的Master_log_pos不一致

    最近在研究mysql的主从,发现一个问题,我在主库做任何修改时,在从库中只有slave_relay_log_info中的Master_log_pos在变化,而slave_master_info中的Ma ...

  2. Elasticsearch 6.x版本全文检索学习之集群调优建议

    1.系统设置要到位,遵照官方建议设置所有的系统参数. https://www.elastic.co/guide/en/elasticsearch/reference/6.7/setup.html 部署 ...

  3. Java后端高频面试题汇总

    Java后端面试题汇总 近来,分专题更新了Java后端面试题,此文章对这些文章做一个目录式的整理,方便查看 1.Java基础   https://www.cnblogs.com/autism-dong ...

  4. iPhone每一代的屏幕尺寸比例是多少？

    参考链接: https://www.jianshu.com/p/8f566ce3bc2c https://zhidao.baidu.com/question/1668756575750668747.h ...

  5. 用了这么久HTTP, 你是否了解Content-Length?

    摘要: 理解HTTP协议... 原文:用了这么久HTTP, 你是否了解Content-Length和Transfer-Encoding ? 作者:朴瑞卿的博客 由Content-Length导致的问题 ...

  6. MyBatis之接口绑定方案及多参数传递

    1.说明   所谓的MyBatis接口绑定,指的是实现创建一个接口后,把mapper.xml 由mybatis 生成接口的实现类,通过调用接口对象就可以获取mapper.xml 中编写的sql.在SS ...

  7. qtdomdocument找不到

  8. acwing 652. 切蛋糕

    题目地址 今天是小Z的生日,同学们为他带来了一块蛋糕. 这块蛋糕是一个长方体,被用不同色彩分成了N个相同的小块,每小块都有对应的幸运值. 小Z作为寿星,自然希望吃到的第一块蛋糕的幸运值总和最大,但小Z ...

  9. 14.web4

    右键查看源代码 先进行URL解码 解码之后可以得到一串 js 代码, 具体逻辑大概就是 var p1 = "67d709b2b"var p2 = "aa648cf6e87 ...

  10. python(leetcode)498. 对角线遍历

    这题难度中等,记录下思路 第一个会超时, 第二个:思想是按斜对角线行进行右下左上交替遍历, def traverse(matrix): n=len(matrix)-1 m=len(matrix[0]) ...