Welcome ! HomeForums
Login Register

Forums Home| Sms Zone
ওয়েবসাইট তৈরি করতে ক্লিক করুন
Write New Thread

Forums.Likebd.Com > English Forums > Design and Development > CSS > css text effect

css text effect

Facebook Twitter Googleplus Pint Views: 924
Thread Rating:
0 Vote(s) - 0 Average 1 2 3 4 5
(06-28-2018, 09:31 AM ) width= Hasan [ 1 ]
This tutorial will teach you how to manipulate text using CSS properties. You can set following text properties of an element:

The color property is used to set the color of a text.

The direction property is used to set the text direction.

The letter-spacing property is used to add or subtract space between the letters that make up a word.

The word-spacing property is used to add or subtract space between the words of a sentence.

The text-indent property is used to indent the text of a paragraph.

The text-align property is used to align the text of a document.

The text-decoration property is used to underline, overline, and strikethrough text.

The text-transform property is used to capitalize text or convert text to uppercase or lowercase letters.

The white-space property is used to control the flow and formatting of text.

The text-shadow property is used to set the text shadow around a text.

Set the text color:
Following is the example which demonstrates how to set the text color. Possible value could be any color name in any valid format.

<p style="color:red;">
This text will be written in red.
</p>
Quote
(06-28-2018, 09:31 AM ) width= Hasan [ 1 ]
Set the text direction :
Following is the example which demonstrates how to set the direction of a text. Possible values are ltr or rtl.

<p style="direction:rtl;">
This text will be renedered from right to left
</p>
Quote
(06-28-2018, 09:31 AM ) width= Hasan [ 1 ]
Set the space between characters:
Following is the example which demonstrates how to set the space between characters. Possible values are normal or a number specifying space..

<p style="letter-spacing:5px;">
This text is having space between letters.
</p>
This will produce following result:

This text is having space between letters.
Quote
(06-28-2018, 09:32 AM ) width= Hasan [ 1 ]
Set the space between words:
Following is the example which demonstrates how to set the space between words. Possible values are normal or a number specifying space..

<p style="word-spacing:5px;">
This text is having space between words.
</p>
Quote
(06-28-2018, 09:32 AM ) width= Hasan [ 1 ]
Set the text indent:
Following is the example which demonstrates how to indent the first line of a paragraph. Possible values are % or a number specifying indent space..

<p style="text-indent:1cm;">
This text will have first line indented by 1cm
and this line will remain at its actual position
this is done by CSS text-indent property.
</p>
Quote
(06-28-2018, 09:33 AM ) width= Hasan [ 1 ]
Set the text alignment:
Following is the example which demonstrates how to align a text. Possible values are left, right, center, justify..

<p style="text-align:right;">
This will be right aligned.
</p>
<p style="text-align:center;">
This will be center aligned.
</p>
<p style="text-align:left;">
This will be left aligned.
</p>
Quote
(06-28-2018, 09:33 AM ) width= Hasan [ 1 ]
Decorating the text:
Following is the example which demonstrates how to decorate a text. Possible values are none, underline, overline, line-through, blink..

<p style="text-decoration:underline;">
This will be underlined
</p>
<p style="text-decoration:line-through;">
This will be striked through.
</p>
<p style="text-decoration:overline;">
This will have a over line.
</p>
<p style="text-decoration:blink;">
This text will have blinking effect
</p>
Quote
(06-28-2018, 09:33 AM ) width= Hasan [ 1 ]
Set the text cases:
Following is the example which demonstrates how to set the cases for a text. Possible values are none, capitalize, uppercase, lowercase..

<p style="text-transform:capitalize;">
This will be capitalized
</p>
<p style="text-transform:uppercase;">
This will be in uppercase
</p>
<p style="text-transform:lowercase;">
This will be in lowercase
</p>
Quote
(06-28-2018, 09:33 AM ) width= Hasan [ 1 ]
Set the white space between text:
Following is the example which demonstrates how white space inside an element is handled. Possible values are normal, pre, nowrap.

<p style="white-space:pre;">This text has a line break
and the white-space pre setting tells the browser to honor it
just like the HTML pre tag.</p>
Quote
(06-28-2018, 09:34 AM ) width= Hasan [ 1 ]
Set the text shadow:
Following is the example which demonstrates how to set the shadow around a text. This may not be supported by all the browsers.

<p style="text-shadow:4px 4px 8px blue;">
If your browser supports the CSS text-shadow property,
this text will have a blue shadow.</p>
Quote
« Next Oldest | Next Newest »

You must Login for comment or Register here
Share Link
Link :
HTML Link:
BBcode Link:

Tag:

css text effect free net tips, css text effect Tips and Trick, css text effect Free download, css text effect jokes koutuk, css text effect hasir golpo, Funny golpo story 2015 2016 207, css text effect New tips, css text effect all Golpo story fun jokes,css text effect wapka wml xhtml code css

Possibly Related Threads…
  CSS white-space Property
  CSS - Tables
  CSS - Links
  CSS - Images
  Setting Fonts using CSS
  Setting Backgrounds using CSS
  CSS - Colors
  CSS Syntax - Selectors
  CSS Introduction


  • Subscribe to this thread


EasyMenu
Create Post:
Forum Jump:
Main Category
Bangla Sms বাংলা এসএমএস
English Sms বিজ্ঞান-ও-প্রযুক্তি
ইসলামের কথা খবরা-খবর
বিনোদন ডেস্ক খেলাধুলার খবর
দৈনন্দিন জীবন টিপস এবং ট্রিক
রিভিউ সমগ গল্প সমগ্র
কবিতা সমগ্র অপরেটর নিউজ
বিশেষ আয়োজন গানের কথা
অন্যান্য ও মজা বাংলা কৌতুক
জানা ও অজানা পড়াশোনা
চাকুরির বিজ্ঞপ্তি Web-Development
Return to Top Forums.Likebd.com :: Bangladesh First Forums and Community Place
Switch to Desktop Version
Back To : Likebd.com