Skip to main content

How To Style Your Text With CSS

Styling text with CSS is really simple. We can define colors, underline it, make it bold, define the font etc etc. We will start with some basics. First we define the html where we will be working with. This is the text 1. Colorize your text We can select the P tag and add some styles to it. p { color:red; } Now our text will turn red. You can define any color code your want or choose one of the 16 standard color names. The color names are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white and yellow. 2. Define the size of your text p { font-size:12px; } You can define any font-size you want, 145 pixels is not a problem. That is, technically speaking. 3. Make the text bold or Italic You can use the font-style property to create these effects. Bold: p { font-weight:bold; } Italic p { font-style:italic; } 4. Overline, Underline, strike-through and none The text-decoration property is useful to create the underline and the other effects we need. p { text-decoration:underline; text-decoration:line-through; text-decoration:overline; text-decoration:none; } On default, the text doesnt have any lines at all. Except for the link. You can remove the underline by using the text-decoration:none; setting. You see, its quite easy to style your text using CSS. And you can do it all in a separate stylesheet!

Comments

Popular posts from this blog

How to Create Chat Bubbles in CSS

At first, you need to write the appropriate HTML markup. Refer to the examples below: INPUT HTML <div class="talk-bubble"> <div class="talktext"> <p>CSS Talk Bubble configured by classes. Defaults to square shape, no triangle. Height is auto-adjusting to the height of the text.</p> </div> </div> <div class="talk-bubble tri-right left-top"> <div class="talktext"> <p>This one adds a right triangle on the left, flush at the top by using .tri-right and .left-top to specify the location.</p> </div> </div> <div class="talk-bubble tri-right left-in"> <div class="talktext"> <p>This talk-bubble uses .left-in class to show a triangle on the left slightly indented. Still a blocky square.</p> </div> </div> <div class="talk-bubble tri-right round btm-left"> <div class="talktext"> <p>And now...

How to Deal With Computer Fatigue

What is fatigue? The medical community generally views fatigue as a source of mystery — a complex physical condition that afflicts millions of people worldwide. It is not quite on the same level as being tired, as most people can easily say that they are beyond tired by the time fatigue sets in. Fatigue sets the body into a state of near-total lethargy. When fatigue sets in, When fatigue sets in, the continuation of other physical activities is almost always nearly impossible. Further activity could result in muscle spasms and pain in various parts of the body. Lower back pain is one of the most common ailments suffered by people with fatigue. In some cases, a fatigued individual may experience somnolence due to fatigue, though excessive physical labor is not the only cause of somnolence. Is mental fatigue real? It is also possible for a person to experience a sort of mental fatigue that, in most respects, is not linked to the overexertion of the body. The mind is just like any othe...

How to Install and Configure Drupal

Drupal is a feature rich Content Management System (CMS) which allows webmasters to run dynamic website without PHP knowledge. Publishers can add website content through admin interface. Thanks many modules it is possible to install a lot of additional features like spell check, displaying banners or AdSense ads, chat, mailing list, e-commerce modules etc. Drupal CMS was written in PHP and can be downloaded free of charge. In this article I will explain how to install this script and describe the configuration basics. Web hosting requirements for Drupal CMS Before you start the installation process, ensure that your web host offers PHP support, cron jobs and MySQL database. Drupal requires PHP version 4.3.3 or higher (Drupal 4.5 and earlier versions will not run on PHP 5), PHP XML extension and MySQL v3.23.17 or higher. If you are not sure which version of PHP and MySQL your web hosting provider currently uses, contact their help desk and ask them first. How to install Drupal CMS ...