Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> CSS

सीएसएस के साथ काम करने वाला टेक्स्ट ट्रांसफॉर्मेशन

<घंटा/>

CSS टेक्स्ट-ट्रांसफ़ॉर्म प्रॉपर्टी हमें किसी तत्व के लिए टेक्स्ट कैपिटलाइज़ेशन सेट करने की अनुमति देती है। यह निम्नलिखित मानों को स्वीकार कर सकता है:कैपिटलाइज़, लोअरकेस, अपरकेस, पूर्ण-चौड़ाई, पूर्ण-आकार-काना और कोई नहीं।

सिंटैक्स

CSS टेक्स्ट-ट्रांसफॉर्म प्रॉपर्टी का सिंटैक्स इस प्रकार है -

Selector {
   text-transform: /*value*/
}

उदाहरण

निम्नलिखित उदाहरण CSS टेक्स्ट-ट्रांसफॉर्म प्रॉपर्टी को दर्शाते हैं -

<!DOCTYPE html>
<html>
<head>
<style>
h2 {
   text-transform: uppercase;
}
.demo {
   text-transform: lowercase;
}
q {
   text-transform: capitalize;
   font-style: italic;
}
</style>
</head>
<body>
<h2>WordPress</h2>
<q>WordPress is open source software you can use to create a beautiful website, blog, or app.</q>
<p class="demo">34% of the web uses WordPress, from hobby blogs to the biggest news sites online.</p>
</body>
</html>

आउटपुट

यह निम्न आउटपुट देता है -

सीएसएस के साथ काम करने वाला टेक्स्ट ट्रांसफॉर्मेशन

उदाहरण

<!DOCTYPE html>
<html>
<head>
<style>
div {
   background-color: lightgreen;
   margin: auto;
   text-align: center;
}
p {
   width: 80%;
   background-color: aquamarine;
   text-decoration: uppercase;
}
article {
   background-color: darksalmon;
   text-transform: lowercase;
}
</style>
</head>
<body>
<h2>What is Magento?</h2>
<div>
<p>Magento is an open-source e-commerce platform written in PHP.</p>
<article>
Build your own branded store powered by Magento Commerce and Amazon. Choose from 4,600 themes and extensions in the Magento Marketplace as well as more than 300,000 Magento developers.
</article>
</div>
</body>
</html>

आउटपुट

यह निम्न आउटपुट देता है -

सीएसएस के साथ काम करने वाला टेक्स्ट ट्रांसफॉर्मेशन


  1. टेक्स्ट इंडेंटेशन सीएसएस के साथ काम करना

    CSS टेक्स्ट-इंडेंट प्रॉपर्टी हमें किसी एलीमेंट की पहली लाइन का इंडेंटेशन सेट करने में मदद करती है। सिंटैक्स CSS टेक्स्ट-इंडेंट प्रॉपर्टी का सिंटैक्स इस प्रकार है - Selector {    text-indent: /*value*/ } उदाहरण निम्नलिखित उदाहरण CSS टेक्स्ट-इंडेंट प्रॉपर्टी को दर्शाते हैं। <!DOCTYPE ht

  1. सीएसएस के साथ टेक्स्ट बटन कैसे स्टाइल करें?

    CSS के साथ टेक्स्ट बटन को स्टाइल करने के लिए कोड निम्नलिखित है - उदाहरण <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style> button {    border: none;    color: white;  

  1. CSS के साथ ग्लोइंग टेक्स्ट कैसे बनाएं?

    सीएसएस के साथ चमकदार टेक्स्ट बनाने के लिए, कोड इस प्रकार है - उदाहरण <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style>    body {       background-color: rgb(0, 0, 0); &