CSS learner guide http://csslearner.com Sun, 31 May 2009 15:22:12 +0000 en hourly 1 http://wordpress.org/?v=3.0 Integration of external files in CSS /?p=7 /?p=7#comments Sun, 31 May 2009 15:22:12 +0000 admin http://csslearner.com/?p=7 There are 2 different ways how to connect an external CSS file with an HTML file. The external file can be within a Style range – this example looks like this:

<style type=”text/css”>
<!–
@import url(style.css);
//–>
</style>

The syntax of @import url(); binds in the parenthesis indicated CSS file. It is subject to general rules for absolute and relative file paths. This information can also be within a CSS file to make another CSS file involved. Netscape 4 sees this syntax, unlike almost all other CSS-capable browsers. Therefore, it can be also used as a browser switch to Netscape 4 by using CSS commands to use.

The HTML syntax to embed external CSS files, use the Link tag. An example:

<link rel=”stylesheet” type=”text/css” href=”style.css”>

The attribute href specifies the path to the CSS file, but again the general rules for valid paths. In addition, the attributes rel and type attributes duty. By rel is the browser reported that it is a stylesheet that is to be included (the item link can also be used for other purposes), by the attribute type is the mime type specified.

]]> http://csslearner.com/?feed=rss2&p=7 1 CSS Direct Formatting /?p=5 /?p=5#comments Wed, 27 May 2009 18:19:35 +0000 admin http://csslearner.com/?p=5 CSS formatting directly to an individual HTML tag to apply the attribute style in the HTML tag. An example:

<h1 style=”color:#0000FF;”>Example</h1>

This statement is the headline. Note that it is simply the opening HTML tag addition the style attribute, and a corresponding CSS specification behind.

Large File Format in the head area

For further information on file, use the head of an HTML file, i.e. between <head> and </head> the tag <style> noted. Behind all of this HTML file current information and then the field again with </style> closed. All information given here apply to the entire HTML file. An example:

<style type=”text/css”>
<!–
p { font-family:Arial; }
//–>
</style>

The attribute “type” is a mandatory attribute for the opening style tag. Note If you use CSS so in each case: <style type=”text/CSS”> As you can see, I have in this example, the actual CSS values again in an HTML comment inserted <!– //–> This is to prevent very old browser, the element <style> do not know, accidentally, the CSS data as output on the screen.

]]> http://csslearner.com/?feed=rss2&p=5 1 Properties of CSS Fonts /?p=3 /?p=3#comments Mon, 25 May 2009 10:54:27 +0000 admin http://csslearner.com/?p=3 Font Size: The property ‘font-size’

The font size is determined by the property font-size set. You can create many different units (eg pixels and percentages) to the sizes described. In this tutorial we will look at the most frequently used and most suitable units.

Examples are:

h1 (
font-size: 30px;
)

h2 (
font-size: 12cm;
)

h3 (
font-size: 120%;
)

p (
font-size: 1em;
)

There is a fundamental difference between the four above-mentioned units. ‘px’ and ‘pt’ bring the text to an absolute size, while ‘%’ and ‘em’ allows the user to specify the size to change as he or she likes. Many Internet users are disabled, older, visually impaired or ‘suffer’ from the poor quality of their monitor. To make your website accessible for everyone, you should use modifiable units, such as’% ‘or’ em ‘.

The output size of the text in Mozilla Firefox and Internet Explorer can be changed by selecting proper option from the menu. Try it now – nice gimmick don’t you think?

Combination of attributes: the property ‘font’

Using the font attribute can describe any font properties in a single attribute.

For example, imagine the following four lines of code that could change the font properties for <p>:

p (
Font-style: italic;
Font-weight: bold;
Font-size: 30px;
Font-family: arial, sans-serif;
)

If this combination is used, the code can be simplified:

p (
Font: italic bold 30px arial, sans-serif;
)

The order of the values for font property is:

[font-style] | [font-variant] | [font-weight] | [font-size] | [font-family]

]]> http://csslearner.com/?feed=rss2&p=3 0