CSS: The basics part 3 – Inline CSS

Another round of CSS. Today, inline CSS. The least efficient way of coding CSS.. But I’ll tell you anyway.. (hardcore geek babeh)..

As explained in part 1 of this series, the coding of this type of css happens in the HTML tag itself. It’s quite simple honestly. Let me give you a simple example.

I again made a basic HTML script (if you just joined us and don’t know what the hell I’m talking about when mentioning HTML, please read this…).

Right, inline CSS implies that the CSS syntax is within the HTML tag you want to format. In my case, again, the FONT tag. In order to input CSS properties in a tag you should add the option STYLE followed by all the properties you want to use.
For example:

<FONT STYLE=”COLOR:#aa9966″>Some Random Mumbo Jumbo</FONT>

This will just apply a color to your text (I already told you I’m not the most creative person >_<).

Result will be:

Also with inline CSS you can chain options. All options are separated with a semicolon. As for example:

<FONT STYLE=”COLOR:#aa9966;font: italic bold 12pt/14pt Times, serif;background-color:#123456″>Some Random Mumbo Jumbo</FONT>

Result of this code will be:

Oh right… I may have forgot to mention that this is actually the easiest way to code CSS ;-)… But this doesn’t mean you should always use inline CSS. The easiest way is not always the best way!
Depending on what you are doing and what you want to achieve, embedded or external CSS coding could spare you a giant pile of s… ehm… trouble.

Good luck and until next time!


5 thoughts on “CSS: The basics part 3 – Inline CSS

  1. Pingback: CSS: The basics part 2 – Embedded CSS « Tech-o-rama

  2. Pingback: Advanced webcoding: Javascript – Part 1 « Tech-o-rama

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: