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...

Create And Send Html Email Newsletters Easily

An Introduction To Email Newsletters Email newsletters are being recognized as a great way to enhance sales. Just what are newsletters? They are regular snippets of information that are delivered to you via email. These snippets of information can be on any topic on the planet. As long as someone wants the information, there is potential for an Email newsletter. Newsletter data has revealed many positive aspects of email newsletters. If you want to create and send an HTML email newsletter, you should know of this information. Research shows that if you use newsletters properly, 10% of subscribers can be turned into customers. Now that is information that I would gladly digest. HTML Email Newsletters There are two types of email newsletters. One type is based on text and the other type on HTML (Hyper text markup language). Both these types of newsletters have their own positives and negatives. Ultimately which newsletter you decide to create depends on the ultimate product and the pr...

Hidden HTML And The Keywords They Love

Selecting keywords If you have a website that is not performing well it is possible that you have selected keywords or phrases that are too general. When you choose an all-encompassing keyword or phrase you have to understand there is significant competition for the same broad term. To set your website apart you may need to look into the possibility of become much more specific about describing your product in keyword phrasing. For instance if you sell sweatshirts, you may want to choose more specific phrasing than simply ‘sweatshirts’. You might improve your site rankings by using terms such as ‘sports theme sweatshirts’ or ‘sports theme apparel’ or even go so far as to name individual sports teams as part of you keyword options. By checking out the online competition you have a greater opportunity to see how you can set yourself apart and be unique in competitive online marketing. Keywords that your competition is targeting Did you know you can actually observe the keywords and ...