Stickies & Notes on CSS
CSS info, tips, code samples, etc.
What is the Syntax for CSS?:
body {
background: #DCDCDC
}
Basic CSS Syntax = selector {property: value}.
- selector = the HTML element/tag you wish to define
- property = the attribute you wish to change.
- value = each property can take a value
In the example at right, the syntax is define as follows:
- selector = body
- property = background.
- value = #DCDCDC
Defining Colors in CSS:
use this: #2F4F4F
instead of this: DarkSlateGrey
Define colors in hex code - NOT by color name.
There are colornames that are "supported by all major browsers" - in theory. However, it is my experience that in reality, this is not necessarily so.
To insure that defined colors display as consistently as possible - use hex.
CSS Positioning:
#leftcol1 {
position: absolute;
top: 65%;
left: 2%;
border: 1px outset #FFF;
width: 20%;
z-index:-1;
}
The z-index property 'Default' value is 0.
Use the z-index property to slide scrolling elements over/under fixed elements by assigning plus (+) or minus (-) values to z-index properties.
The header and left navigation menu on this site are working examples.
See the code example at right for syntax.
"Position:" property values & definitions:
- Position: relative = moves an element relative to its normal position.
- Position: absolute = is positioned at the specified coordinates relative to its containing block.
- Position: fixed = is positioned at the specified coordinates relative to the browser window.
- Position: static = has the position the normal flow of the page gives it. (default)
More Notes:
Upgrading Websites to CSS
Positioning Website Elements on a Page with CSS
MENU:
Learning CSS:
Working with CSS
CSS Tools:
Software for Your CSS Websites