2013年6月26日 星期三

css (casading style sheet) listing example eg sample e.g.

css-list

http://hongkong2000.freehostia.com/html/css0.html


input[type="text"][disabled] {color:black;}



div

div.test
{
white-space:nowrap;
width:12em;
overflow:hidden; //*visible || hidden || scroll || auto */
border:1px solid #000000;
}

input line
.LineInputText {
height: 20px;
border:thin solid #777;
padding: 2px 2px 2px;
line-height: 1;
outline: none;
-moz-border-radius:5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}




#nav {list-style:none; }
#nav ul {list-style:none; margin:0; padding:0; width:auto; display:none; }
#nav li {font-size:24px; floag:left; position:relative; width:80px; height 50px; }
#nav li ul li {background-image:url (../images/bar_background.png);background-repeat:no-repeat; background-size:cover; border:3px solid #e3e3e3;padding-left:10px; }
#nav a:link, # nav a;active, # nav a visited {display:block; color:#fff; text-decoration:none;}
#nav a:hover{color:lightblue;}

jquery
function mainmenu()
{$("nav ul").css({display:"none"})
$("nav li").hover(function() {
$(this).find('ul:first').css('visiblility:"visible", dislplay:"none"}).show(400);},
FUNCTION(){$(this).find('ul.first').css({visiblity:"hidden"})}
});
}
$(document).ready(function(){mainmenu();});

{display:"none"})

}





example h1
{
color: #16C;
font-weight:normal;
letter-spacing:.4em;
margin-bottom:1em;
margin:1em auto;
text-transform: lowercase;
}

Type Category
Font-Family
Font-Size : pixels | picas | percentages.
Font-Style : normal | italic | oblique
Line-Height:  pixels | picas | percentages
Font-Decoratiion : uerlined | overlined  | blink | none
Font-Weight
Font-Variabt
Font-Transform : uppercase | lowercase  | initial caps  | no capitialization
color

Block Category
word-Spacing : mm | cn | picas | inches | pixels | ems | exs
letter-spacing : .4em | cm | picas | inches | pixels | ems | exs
vertical-align (aligns inline elements) :  baseline | sub | super | top | text-top | middle | bottom | text-bottom
test-align : left | right | center
test-indent : can negative
while-space (handle line breaks and spaces):  normal | pre | nowrap
display : inline | none

Box Category
width : pixels | points  | inches  | centimeters  | picas  |ems  | exs  | percentages
height
float
clear: left || right || both
padding
margin  (sets the amount of space around the outside of an element)

Positioning Category
position : absolute  | fixed  | relative  | static
fixed
relative
static
width,height
placement : top  | right | bottom  | left
viability : inherit  | visible  |hidden
z-index
overflow:visible || hidden || scroll || auto
clip
text-overflow:clip | ellipsis;

Extensions category
page-break
cursor:pointer  | hand | pointer  |  move  | text | wait | help
filter


css border

border : 1 px block solid
border -width (thin, medium, thick)
border-color
border-style (solid,dashed, dotted,double, grove, ridge, inside, outside)
border-top,left,bottom,right
border-solid none
border: 1px
border : #888888
border : none

css background

background-Attacment: Fixed || Scroll
background-Position(x): left | center | right | 1234
background-Position(y): top | center | botton | 1234
background: none;
background-image: url(bar_textbox.png);
background-image:url(../Images/banner.jpg);
background-repeat: no-repeat  | Repeat-X | Repeat-Y | repeat
background-color
background:#abcdef; #elele
background:rgb(233,233,233)
background:none
background-size:cover;
background-image:url(bar_textbox.png)
background-position:0.57px

border-style:hidden | none
border:solid 1px


css display
display:block;
display:none;
display:inline;


css float
float:left,clear,right

css font
font-size:12px
a {font-size: 150%;}  /* menu font size*/
font-weight:normal
font-family:Arrial, Helvetica, sane-serif;

font-style
line-height
font-decoration
font-weight
font-variant
font-transform
color





height:

line-height:1

max-height
max-width
min-height
min-width

margin-left:12px
margin:0em;

outline:none padding

padding-left:1em


table-layout:fixed | auto | inherit
table-labout:automatic
table-layout:fixed | auto


text-align:center, left
text-decoration: underline, none
text-align:left
text-align: right;
text-shadow:0.1em  0.1em #333;


vertical-align:top
vertical-align: middle

width:auto, length px,cm %, inhert
while-space:newrap



沒有留言:

張貼留言