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. Java入门系列之类继承、抽象类、接口（五）

    前言 C#和Java关于类.抽象类.接口使用方式基本相似,只是对应关键字使用不同罢了,本节呢,我们只是对照C#和Java中关于这三个概念在具体使用时,看看有哪些不一样的地方. 类继承 C#和Java在 ...

  2. WebShell代码分析溯源(三)

    WebShell代码分析溯源(三) 一.一句话变形马样本 <?php $g = array('','s');$gg = a.$g[1].ser.chr('116');@$gg($_POST[ge ...

  3. Python中的常见特殊方法—— repr方法

    在Python中有些方法名.属性名的前后都添加了双下划线,这种方法.属性通常都属于Python的特殊方法和特殊属性,开发者可以通过重写这些方法或者直接调用这些方法来实现特殊的功能.其实前面见过的构造方 ...

  4. flush() 缓冲输出流的缓冲区问题

    package seday06; import java.io.BufferedOutputStream;import java.io.FileOutputStream;import java.io. ...

  5. Java生鲜电商平台-电商数据运营统计与分析

    Java生鲜电商平台-电商数据运营统计与分析 今天分享将会分为以下几个方面来阐述: 1. 作为运营我们需要统计与分析的几个核心数据是什么? 2. 核心数据对业务的指导价值在哪里呢? 3. 作为产品PM ...

  6. seaborn总结

    Seaborn 数据可视化基础 介绍 Matplotlib 是支持 Python 语言的开源绘图库,因为其支持丰富的绘图类型.简单的绘图方式以及完善的接口文档,深受 Python 工程师.科研学者.数 ...

  7. Python Web（二）

    Infi-chu: http://www.cnblogs.com/Infi-chu/ 一.Django-debug-toolbar django-debug-toolbar 是一组可配置的面板,可显示 ...

  8. Unitest自动化测试基于HTMLTestRunner报告案例

    报告效果如下: HTMLTestRunner脚本代码如下: #coding=utf-8 # URL: http://tungwaiyip.info/software/HTMLTestRunner.ht ...

  9. 零基础建站如何配置PHP运行环境 几种服务器环境配置的选择和方法

    上次给大家分享了小白建站如何选择虚拟空间及服务器,及购买域名的基础知识,这些是硬性要求,你的网站要想运行起来,硬件只是基础,真正的技术是软件,关于PHP软件开发技术,后面我们会慢慢的分享给大家,今天主 ...

  10. kettle教程---通过配置表格配置实现数据的批量增量更新（实用）

    本文接上篇文章,上面文章讲的是,通过配置文件的全量更新,现在说下增量更新 如上图所示,涉及到1个转换和1个作业. 1-表增量同步(转换) 可以通过读取同步表参数这个excel表格文件,获取表名称和同步 ...