2013年7月11日 星期四

css notes css-notes

~9 pt ~~~~~~~~~~~~~~~  [[ general ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~           
cursor clip color z-index
background, background-attachment , background-color:#cff , background-image ,background-position , background-repeat
width : 100% 200px float : left;  clear : left ;  height:30px ; vertical-align:top ; color : # 000 ; display:block;
padding-top : 0 ; margin - top : 0 , marign-right:5px font-size: 11px font-family:Arial 
u1 {list-style-type: none ; margin : 0px , padding : 0px } 

~~~~~~~~~~~~~~~  [[ box model]]  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
BORDER < PROPERTY e.g. border-top : outset, border-style : none , border-left: 12 px solid:10px
left color e.g. border-left-width thick
right style [outset 1px | solid | none] e.g. border-style:none| solid | dashed | dotted | groove |inset | double | hidden | outset | ridge    
top outset e.g. border-top-right-radius:5px, 10px 
bottom width [thick medium thin]
radius
border-color | spacing | width | [collapse | separate] e.g. border 1 px solid # 999999

MARGIN margin-bottom margin-left margin-right:5px margin-top:0
PADDING padding-bottom:10 padding-left padding-right padding-top:0

~~~~~~~~~~~~~~~  [[ Position and Size]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
max-height max-width min-height min-width width height:300px
height left bottom top right width:100% 200px line-height:100%, 10px

~~~~~~~~~~~~~~~  [[ images ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
list-style list-style-image list-style-position list-style-type

~~~~~~~~~~~~~~~  [[ fonts ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
font-inherit font-family:arrial font-size:11px font-style font-variant font-weight
font bold | normal | bolder | lighter 100 200 to 900
font-variant Specifies whether or not a text should be displayed in a small-caps font 1

~~~~~~~~~~~~~~~  [[ table ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
clear:left color:#000 display:block;
caption-side table-layout empty-cells

~~~~~~~~~~~~~~~  [[ div management ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
overflow auto | scroll | hidden | visible 
overflow-y scroll;
float left |  right | left:20px  | right:40px : position:absolute | position:relative; var cssObj1123 = {'float' : 'right'};
direction display position clear {clear:"'both | left"}
quotes unicode-bidi vertical-align:top, middle visibility

~~~~~~~~~~~~~~~  [[ text ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
text-decoration:none text-indent text-shadow text-transform uppercase | lowercase | captiializ
text-align center | right | left |justify
page-break-after page-break-before page-break-inside word-spacing white-space normal | pre | nowrap 
letter-spacing line-height orphans widows
content Used with the :before and :after pseudo-elements, to insert generated content
~~~~~~~~~~~~~~~  [[ points form ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
outline outline-color outline-style outline-width counter-increment counter-reset
~~~~~~~~~~~~~~~ [[ example ]] ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<table class="rootbox" width="100%" border="1" cellspacing="0" cellpadding="0"  style="table-layout:fixed | auto | inherit">
ul {list-stype-type:none; margin:0px, padding:)px} 
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,
table , caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit;
font-style: inherit; font-size: 100%;  font-family: inherit; vertical-align: baseline;}
#myform label {display: block; width: 100px; float: left; font-size:0.875em; text-align: right; margin-right:10px;}
#myform # submit {margin-left: 110px;} 

沒有留言:

張貼留言