Rainer's DHTML Library

Rainer's DHTML Library

· ©2002 Rainer Su . All rights reserved . Introduction To CSS2 CSS Cascading Style Sheet () (Linking to a Style Sheet) .cssHTMLlink <head> <title></title> <link rel=stylesheet href="http://www.dhtmlet.com/dhtmlet.css" type="text/css"> </head> XML <? xml-stylesheet type="text/css" href="http://www.dhtmlet.com/dhtmlet.css" ?> (Embedding a Style Block) HTML<HTML><BODY><STYLE>...</STYLE> <html> <head> <title></title> <style type="text/css"> <!-- body {font: 10pt "Arial"} h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon} h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue} p {font: 10pt/12pt "Arial"; color: black} --> </style> </head> <body> styletype"text/css" (Inline Styles) style <p style="margin-left: 0.5in; margin-right:0.5in"><p> (CSS Syntax) Selector { property: value } Selector -- property : value -- (:)(;) (The ' Inherit ' Value) Inherit Introduction To This Book Rainer's DHTML Library CSS2.0 ( Properties)( At-Rules)( Pseudo-Classes)( Pseudo-Elements)( Declarations)( Units)( Selectors C CSS2.0 Internet Explorer Netscape —— Internet Explorer (Dynamic Properties)(Filters)(Behaviors) HTML(ObjectElement)HTML(Attributes)(Properties) http://www.rainersu.com [email protected] End User License Agreement """""""" http://www.rainersu.com [email protected] www.rainersu.com (Rainer Su) 1996.07-2000.03 (CAOSC) 2000.03-2000.08 (www.chineseall.com) 2000.09-2001.05 (www.rongshu.com) UI 2001.05-2002.04 (Erry) 2002.04-? (Bertelsmann) () [email protected] www.rainersu.com - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - © (Rainer Su)2002 | [email protected] - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - fontCSS1/CSS2 IE4+ NS4+ font : font-style || font-variant || font-weight || font-size || line-height || font- family font : caption | icon | menu | message-box | small-caption | status-bar font-style :� CSS1 font-style font-variant font-variant :� CSS1 font-weight font-weight :� CSS1 font-size :� CSS1 font-size line-height :� CSS1 line-height font-family font-family :� CSS1 caption :� CSS2 () icon :� CSS2 menu :� CSS2 message-box :� CSS2 small-caption :� CSS2 status-bar :� CSS2 normal normal normal medium normal "Times New Roman" @font-face font p { font: italic small-caps 600 12pts/18pts ; } p { font: italic small-caps 600 12pts/150% Courier; } p { font: italic small-caps 600 12pts/1.5 Courier; } p { font: italic small-caps 600 12pts/18pts Courier; } p { font: /18pts serif; } p { font: oblique 100 24pts; } H1 { font: 15pt/17pt bold "Arial" normal } colorCSS1 IE4+ NS4+ color : color color :� color RGB currentStyle color div {color: #345456; } div { color: rgb(100,14,200); } div {color: menu; } div {color: red; } font-familyCSS1 IE4+ NS4+ font-family : name font-family :ncursive | fantasy | monospace | serif | sans-serif name :� fantasy "Times New Roman" @font-face currentStyle fontFamily div.fixedwidth { font-family: Courier, "Courier New", monospace } font-sizeCSS1 IE4+ NS4+ font-size : xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller | length xx-small :� x-small :� small :� medium :� large :� x-large :� xx-large :� larger :� em smaller :� em | length :� currentStyle fontSize p { font-style: normal; } p { font-size: 12px; } p { font-size: 20%; } font-size-adjustCSS2 font-size-adjust : none | number none :� number :� fontSizeAdjust p { font-family: arial, courier; font-size-adjust: none; } p { font-family: verdana, courier; font-size-adjust: .56; } font-stretchCSS2 font-stretch : normal | narrower | wider | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded normal :� narrower :� wider :� fontStretch p { font-stretch: wider; } p { font-stretch: ultra-expanded; } font-styleCSS1 IE4+ NS4+ font-style : normal | italic | oblique normal :� italic :� oblique oblique :� IE Internet currentStyle fontStyle p { font-style: normal; } p { font-style: italic; } p { font-style: oblique; } font-weightCSS1 IE4+ NS4+ font-weight : normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 normal :� 400 bold :� 700 b bolder :� normal > lighter :� normal > 100 :� 200 100 300 200 :� 200 400 300 :� 400 :� normal 400 600 500 :� 500 700 600 :� 700 :� bold 700 900 800 :� 900 :� 800 IE4.0 normal bold currentStyle fontWeight span { font-weight:800; } text-decorationCSS1 IE4+ NS4+ text-decoration : none || underline || blink || overline || line-through none :� blink :� underline :� line-through :� overline :� href a u ins underline strike s del line-through none text-decoration: underline overline blink none text- decoration: none ( img )(<EM></EM>) body none a a IE4+ overline blink blink currentStyle textDecoration div { text-decoration : underline; } div { text-decoration : underline overline; } text-underline-positionIE5.5+ text-underline-position : below | above below :� above :� text-decoration currentStyle textUnderlinePosition p { text-underline-position: above; text-decoration: underline; } text-shadowCSS2 text-shadow : color || length || length || opacity color :� length :� length :� length 0 opacity :� :first-letter :first-line textShadow p { text-shadow: 0px 0px 20px yellow, 0px 0px 10px orange, red 5px -5px; } p:first-letter { font-size: 36px; color: red; text-shadow: red 0px 0px 5px;} font-variantCSS1 IE4+ NS6+ font-variant : normal | small-caps normal :� small-caps :� IE4.0 small-caps currentStyle fontVariant span { font-variant: small-caps; } text-transformCSS1 IE4+ NS4+ text-transform : none | capitalize | uppercase | lowercase none :� capitalize :� uppercase :� lowercase :� currentStyle textTransform div { text-transform : uppercase; } line-heightCSS1 IE4+ NS4+ line-height : normal | length normal :� | length :� currentStyle lineHeight div {line-height:6px; } div {line-height:10.5; } letter-spacingCSS1 IE4+ NS6+ letter-spacing : normal | length normal :� length :� currentStyle letterSpacing div {letter-spacing:6px; } div {letter-spacing:0.5pt; } word-spacingCSS1 IE6+ NS6+ word-spacing : normal | length normal :� length :� IE4+MACIE6 currentStyle wordSpacing div { word-spacing : 10; } div { word-spacing : 10px; } text-indentCSS1 IE4+ NS4+ text-indent : length | length :� 0 ( br ) currentStyle textIndent DIV { text-indent:2cm } .click1 { text-indent:50% } .click2 { text-indent: } text-overflowIE6+ text-overflow : clip | ellipsis clip :� (...) ellipsis :� (...) (...) ellipsis white-space nowrap () ellipsis overflow hidden overflow scroll auto DHTML currentStyle textOverflow div { overflow: hidden; text-overflow:ellipsis; } vertical-alignCSS1/CSS2 IE4+ NS4+ vertical-align : auto | baseline | sub | super | top | text-top | middle | bottom | text-bottom | length auto :� CSS1 layout-flow baseline :� CSS1 valign sub :� CSS1 super :� CSS1 top :� CSS1 valign text-top :� CSS1 valign middle :� CSS1 valign bottom :� CSS1 valign text-bottom :� CSS1 valign | 00% length :� CSS2 IE currentStyle auto baseline currentStyle verticalAlign td { vertical-align : middle; } text-alignCSS1 IE4+ text-align : left | right | center | justify left :� right :� center :� justify :� (block elements) div null currentStyle textAlign div { text-align : center; } layout-flowIE5.5+ layout-flow : horizontal | vertical-ideographic horizontal :� vertical-ideographic :� text-align vertical-align writing-mode currentStyle layoutFlow div { layout-flow : horizontal; } writing-modeIE5.5+ writing-mode : lr-tb | tb-rl lr-tb :� tb-rl :� --90 ---- text-align vertical-align BUTTON CAPTION INPUT INPUT type=button INPUT type=file INPUT type=password INPUT type=reset INPUT type=submit INPUT type=text ISINDEX OPTION TEXTAREA tb-rl tb-rl writing-mode writing-mode currentStyle writingMode div { writing-mode: tb-rl; } directionCSS2 IE5+ direction : ltr | rtl | inherit ltr :� rtl :� inherit :� dir ltr unicode-bidi embed bidi-override currentStyle direction div { direction: rtl; unicode-bidi: bidi-override; } unicode-bidiCSS2 IE5+ unicode-bidi : normal | bidi-override | embed normal :� bidi-override :� direction embed :� direction direction direction embed bidi-override Unicode -- currentStyle unicodeBidi div { direction: rtl; unicode-bidi: bidi-override; } word-breakIE5+ word-break : normal | break-all | keep-all normal :� break-all :� normal keep-all :� normal break-all currentStyle wordBreak div {word-break : break-all; } line-breakIE5+ line-break : normal | strict normal :� strict :� currentStyle lineBreak div { line-break : strict; } white-spaceCSS1 IE5.5+ NS4+ white-space : normal | pre | nowrap normal :� IE6+ !DOCTYPE standards-compliant mode pre :� !DOCTYPE standards-compliant mode normal pre nowrap :� br noWrap TABHTML normal (DOM)IE currentStyle whiteSpace p { white-space: nowrap; } word-wrapIE5.5+ word-wrap : normal | break-word normal :� break-word :� ( word-break ) height currentStyle wordWrap div { word-wrap: break-word; word-break: break-all; } text-autospaceIE5+ text-autospace : none | ideograph-alpha|ideograph-numeric | ideograph- parenthesis | ideograph-space none :� (Latin-basedGreekCyrillicArabicHebrew ideograph-alpha :� ) ideograph-numeric :� ideograph-parenthesis :� () ideograph-space :� currentStyle textAutospace div {text-autospace: ideograph-alpha; } text-kashida-spaceIE5.5+ text-kashida-space : length | inherit length :� kashida100%kashida0% inherit :� 0% Kashida Kashida text-justify auto distribute kashida currentStyle textKashidaSpace div { text-kashida-space : 50%;text-justify: kashida; } text-justifyIE5+ text-justify : auto | distribute

View Full Text

Details

  • File Type
    pdf
  • Upload Time
    -
  • Content Languages
    English
  • Upload User
    Anonymous/Not logged-in
  • File Pages
    307 Page
  • File Size
    -

Download

Channel Download Status
Express Download Enable

Copyright

We respect the copyrights and intellectual property rights of all users. All uploaded documents are either original works of the uploader or authorized works of the rightful owners.

  • Not to be reproduced or distributed without explicit permission.
  • Not used for commercial purposes outside of approved use cases.
  • Not used to infringe on the rights of the original creators.
  • If you believe any content infringes your copyright, please contact us immediately.

Support

For help with questions, suggestions, or problems, please contact us