CSS Elements and properties listings
What you should already know:
- Knowledge of CSS
- Knowledge of HTML
Here’s how you can use it just in case you forgot:
Tag {property: value;}
Ok, this is the listing for the TAGS you can use in CSS. This isn’t the limit,
you can basically use just about all HTML tags, these are just the most commonly used.
BODY The BODY P Paragprah B Bold I Italics TABLE table TR Table Row TD Table data H1-H6 Header tags H1 through H6 BR Break BIG BIG text tag SMALL small text tag SUB Subscript SUP Superscript A:link Use of <A HREF> link tag A:visited what a link should look like after it's been visited A:hover What a link should look like after the mouse goes over it. A:active what a link should look like when iy's untouched. LI List UL Unordered List OL Ordered List INPUT Used for Buttons,Text Boxes, Check Boxes IMG Image Tag
Ok, now I’m going to list the properties you can use for TAGS
Remember, properties are used like this:
TAG {property: value;}
So for the property of color:
P {color: red;}
Ok, now for the listing:
Text, Link, and Anything that has to do with Text properties and values
Remember, CSS is:
TAG {property: value;}
Note: PX and CM are the metrics for CSS. It’s like 2lbs, 3lbs, 4 inches for the real world.
Note: BORDER properties can be used for anything, not just tables
[Property] [Value]
color: #FFFFFF or Typed out colors White, Red, etc
letter-spacing: 1px or higher -1px or higher. Space between l e t t e r s
text-align: center,left or right
text-decoration: underline,overline,line-through or none
text-indent: 1cm or higher -1cm or higher. Used for paragraph indention.
text-transform: uppercase, lowercase, or capitalize
direction: Direction of text. rtl or ltr values
text-shadow: Gives text a shadow. Values must be color and length.
unicode-bidi: normal,embed, or bidi-override
white-space: Sets white space. Values are pre, nowrap, and normal
word-spacing: normal or length
font-family: Name of the font that wants to be used.
font-size: xx-small,x-small,small,medium,large,x-large,xx-large,smaller,larger
or 1px or higher to -1px or higher
font-style: normal, italic, or oblique
font-variant: normal or small-caps
Properties and values for Tables and various tags
[Property] [Value]
border: must be border-width:, border-style: and border-color:;
border-width: 1px or higher to -1px or higher.
border-color: #FFFFFF or White
border-style: none, hidden, dotted, dashed, solid, double, groove, ridge,
inset, or outset.
border-right: values must be color, style, and width
( EXAMPLE: P {border-right: blue, solid, 2px;} )
border-left: values must be color, style, and width
( EXAMPLE: P {border-left: blue, solid, 2px;} )
border-top: values must be color, style, and width
( EXAMPLE: P {border-top: blue, solid, 2px;} )
border-bottom:values must be color, style, and width
( EXAMPLE: P {border-bottom: blue, solid,2px;} )
cursor: Changes the cursor. Auto,Crosshair,Default,Hand,Move,e-resize,ne-resize,
nw-resize,n-resize, se-resize,sw-resize,s-resize,w-resize,text,wait,help
visibility Can make an TAG visible or invisible. Values are visible or invisible.
Positioning in CSS
In CSS, you can position elements, This means that you can move
text, links, a table or an image anywhere in the page. Let’s say I want
TABLE {position: absolute; top: 12px; right: 67px; left: 0px; bottom: 0px;}
Now the table is position at 12 pixels up and 67 pixels to the right. It’s
a pretty poor positioning system because you have to keep on positioning
out of trial and error,but it gets the job done.
You don’t have to use all of the properties like i did. You can just use the
properties that your going to have values in.
[Property] [Value]
position: absolute, static, or relative. Try them. Use absolute
if you want to move the element anywhere on the page.
z-index: 1px or higher to -1px or higher. You can put an element
behind another one.
NOTE: Be sure to put the z-index on the TAG that you want to put behind another one.
Extras
These are used to style any scrollbar, including textarea scrollbars & the browser scrollbar
scrollbar-base-color: Any color. #FFFFFF or Typed Out scrollbar-arrow-color: Any color. #FFFFFF or Typed Out scrollbar-DarkShadow-Color: Any color. #FFFFFF or Typed Out
Verifications
Things to remember:
TAG {property: value;}PXandCMare metrics.- You can use Hex Colors.
Play around with CSS and see what you get. Be creative & try many things.
