Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Difference between text-transform: uppercase; and all caps [closed]

Tags:

html

css

What is the difference between

<span style="text-transform: uppercase;">some text</span>

and

<span>SOME TEXT</span>

I mean both look exactly the same, but I have read somewhere that it is better to write the text normal in html and then set text-transform: uppercase; in CSS, but does it really make a difference? I know you can use text-transform: uppercase; if you want to automatically capitalize every first letter of all paragraphs on a page with pseudo-elements (:first-letter). I think it would even use more memory and processing/rendering time if you use text-transform: uppercase;.

like image 704
Dominik Schmidt Avatar asked May 18 '14 18:05

Dominik Schmidt


People also ask

Is uppercase the same as all caps?

A word written entirely in uppercase letters (like WHAT) is said to be written in caps or all caps. Example: A lot of people don't bother using uppercase letters in text messages unless they want to emphasize something.

What this mean text-transform capitalize?

The text-transform CSS property specifies how to capitalize an element's text. It can be used to make text appear in all-uppercase or all-lowercase, or with each word capitalized. It also can help improve legibility for ruby.

What is the difference between text-transform & font variant?

text-transform is simply about converting case. font-variant ideally is about using a variation of the font specifically designed by font designer which is called small capitals.

Does the text-transform property controls the capitalization of text?

The text-transform property controls capitalization effects of an element's text.


1 Answers

From a design and content perspective, the CSS option is better.

For starters, you should always use CSS for appearance. HTML is only to describe and structure content.

Now imagine you have a special term on your site that you want in all caps, but tomorrow you decide it should be in small caps or initial caps. Which is easier to change: one line in a style sheet or x number of instances buried in text?

Using CSS today will make your life easier tomorrow.

like image 86
EricMPastore Avatar answered Nov 07 '22 00:11

EricMPastore