Home > Web Front-end > CSS Tutorial > What is the css code to change lowercase to uppercase?

What is the css code to change lowercase to uppercase?

WBOY
Release: 2021-12-14 11:51:31
Original
1760 people have browsed it

In CSS, the code for changing lowercase to uppercase is "text-transform:uppercase"; the function of the "text-transform" attribute is to control the uppercase and lowercase style of the element text. When the value of the attribute is "uppercase" , the lowercase text style within the element will become uppercase.

What is the css code to change lowercase to uppercase?

The operating environment of this tutorial: Windows 10 system, CSS3&&HTML5 version, Dell G3 computer.

What is the css code that changes lowercase to uppercase?

In css, if you want to achieve the effect of lowercase to uppercase, you can use text-transform Attributes.

This attribute will change the case of letters in the element, regardless of the case of the text in the source document. If the value is capitalize, some letters are capitalized, but it is not clearly defined how to determine which letters are capitalized, it is up to the user agent to recognize the individual "words".

The text-transform attribute is used to control the case of text. When the value of the attribute is uppercase, it is defined that there are only uppercase letters in the text.

The syntax is:

元素{text-transform:uppercase;}
Copy after login

The example is as follows:

<html>
<head>
<style type="text/css">
  h1 {
  text-transform: uppercase;
  }
  p{
  text-transform: uppercase;
  }
</style>
</head>
<body>
<h1>abcdefg</h1>
<p>qwerzxcv</p>
</body>
</html>
Copy after login

Output result:

What is the css code to change lowercase to uppercase?

(Learning video sharing:css video tutorial)

The above is the detailed content of What is the css code to change lowercase to uppercase?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
css
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template