تعلم CSS بسهولة

Document Sample
تعلم CSS بسهولة Powered By Docstoc
					           Cascading Style Sheets With HTML And Any Languages
                                 2003/02/05




        E7(FG 0.'"G HI3 J5J-
            KL0ILM NO '*
                                                                       CSS


                           First Edition
                                   !"




                                : # $%&
                             .,/0 #'()* +*,-

                           : 1* 23 4$%,5*
                  1.$ +)* $()* 0*,6 $()* 1758 #'()*

                                By :
                          Sami AL-Rabai3h

                        Help With :
            Mahmoud Hussain & Thamer Mohammed




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain   1
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05




789:9;'< =>/%? @-A BC- 7%D?)&0 E'<) F&GH<) IBJ $%&'%() *+),- &.,/0 1'2 34546
$%&'%() *+),- &.,/0? K:>L'M 394N'><) O7P4<) *:>Q R&S0 1'2 3T,>U- EJ?
3.V:4U%() O7;4/L><) W4T 3XY7;><) *- 3:M&N<) 3P4<) EJ 78M R&S<) 3P< Z,G0?
_NU. &-[) )B8Y \M&N% Z) *:/'5% ]E^ _2 `:4Y \':>J[ 7%&X% \Q? @- a<b?
O7;4/L- IB8Y 78M K>L. E'<) 3P4<) gh .3.V:4U%() 7807;4/L- _8U. cde'><)
EG< i)b @- j:4+? )BJ @- j:4+ @G< 3.V:4U%() K4N0 ?h klN<) c7M @- `:<? 3:><7T
3-,4N><) 78M d,2B- Z,G.? \>4N0 7- mn0 3-,4N- h&9:Y 34>'G- \07-,4N- Z,G0
cde'>4< Fd75o IBJ? ]E^ 78C- K8H. (? `4U:Y 3.V:4U%() O7;4/L><7M @G<?
_p>Y Ieq @T D)A )b) cde'><) O7-,4N- I,S. e+ 7- de9M K8- ,J 7- de9M 1.&N'<7Y
3P4< 3l5C<7M r7;<) a<BGY 3.V:4U%s< $>Q&0 )b) 7J7CN- e9H0 3:M&T O7>42 eQ,. 7-
&l2) E9l% Z) W4T 7Ct&q c7'G<) )BJ EY? 784J7U'0 ( Z) W4T u&qvY 3.V:4U%()
3:M&N<) 3P4<7M 78< 7q&^ *- 3.V:4U%() 3P4<7M g) 78<7;M O7;4/L><) @- @G>- de+
                                     . 78M eL9% )b7- w&N0? )e:Q 78>8H0 Z) k:;M

Cascading Style ) _< 7J7CLLo? 34545<) IBJ @- W<?() 3Nl/<) hel% 7CJ @-?
O7P4<) {eq) W4T g,';0 w,6 z&o) 7l'2 \Nl'. w,6? ( Sheets
                     . $%&'%() *+),- K:>L0? &.,/0 EY 3.,:;<) *:|),><)?

Z) K4N% 7C%[ a<b? F&^7l- R&S<)? F&^7l- },|,><7M _oe% Z) W4T 7Ct&q e9<?
~40? k.e;<7M _:/0 1'G<) @- &:pGY cde'>4< •:€<)? _4><) 1l5. e+ a<b &:•
`:< c7'G<7Y _>- ]E^ )BJ Z) e9'Th? 3-,4N><) a< _t,0 W'q },|,><7M d?e0?
( „9Y 3;Ht ‚ƒ @- Z,G'. c7'2 a.e. @:M *|) 7%vY \07-,4N>M _M \07;Ht DeNM
     . ( Style ) r7M •4N'. 7- _2 K8Y W4T )dD7+ a4NU0 Z) …) Zb†M 3:Y72 EJ? &:•

784:t7H0 ‡DvM c7'G<) )BJ O7.,';- $q&^ e9< cde'><) Eo) a< r,+) 3.78C<) EY?
c7'G<) )BJ *|?? O7.,'5><) *:>Q 167C. EG< _>><) _:LH'<7M r7p- _2 R&^?
HTML r7M Z,Y&N. ( @- 7-h 34:4+ 3Y&N- ,<? HTML r) 3P4M @:Yd7N4<
K88Q)? )bˆ EG< )e:Q 7J,>8H:< Style r) W4T K8'6)dD „9Y )?V2&. Z) Z,N:/'5:Y
e.&. mn^ eQ? )bˆ jp>Y ECN. )b7- Z,Y&N.? \%,>Q&'. Z) Z,N:/'5. Style D,2
39l5><) \'Y&N- ‰eT *- O7.e'C><) ŠNM EY D,Q,><) Style r) ~4- EY &:P. Z)
~4><) )BJ K8H. Z) *:/'5. c7'G<) )B8< \'6)dD rjo @- _+() W4T HTML r7M
             . Z7>.() ~N|) )BJ? \M 3t7n<) \075>< ~:€.? ]7S. 7>2 &:P.? )e:Q

By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain            2
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05




? 3;HL<) K+d _6&. Zh v/o gh \M eU.? c7'G<) )BJ h&9. mn^ gh @- ),Q&CY
7>2 cde'><) EovY F&9H<) IBJ $;0 I&2b) w,6 gB<) _:>.() W4T 78M v/n<) *+,-
a<b D)eT‹ E<7:4<) 7%&86? K4N0 @- ]7S0 7- _:% W4T? O7-,4N><7M ie- W4T 7Ct&q
e+ v/o _Lq )bˆ aC- F&:Pt 3-,4N>Y Fd,t _€Y) EY 7C4NU0 Z) W4T u&qvY
                                                             . 78:4T e9C<) 7ClCU.
samialr@hotmail.com

)]7TD aC- EHG:Y *:l4< 7LLn- `:<? E%7U- c7'G<) )BJ Z) ,J 7CJ I&2b) 7- &o)?
EM&N<) c7S<) W<) 38Q,><) 1'G<) IBJ @- e.V><) _>T W4T Fde9<)? •:Y,'<7M 7C<
                                      . \'-h? \CŒ,< &:n<) \M 7>M \'+7Œ •&H:<

&o) mn^ g[ \l5%? c7'G<) )BJ 3+&6 ‰eT F,o() @- ,Qdh r,+) Z) ECH6Ž.?
7CCG<? c7'G<) )BJ R&ΠEY DD&'% 7C4NQ 7- )BJ? F&S'C- OeM F&J7X<) IBJ ~6s4Y
3:>^78<) 3:%Dd() 3G4>><) O7l'G- ŠNM EY 7:%?&'G<) `:<? 7.D7T 7M7'G2 I7CNlŒ
15% ?h 7C+,9;M •75- gh? 7C.e< 39•,- \.e< *lŒ ‡,9q W4T …) e>;M 7C4Lq?
34‘75>4< _T7H<) ’&N. e+ 7C< \+,9q &2b &:PM *+,- gvM ID,Q? ?h 7C< c7'G<)
E'<) •‘7•,<) 78< 7C<76d†M 3H:€'5><) 32&S<) 346)&- rjo @- \N+,- •4P.? 3:%,%79<)
&2b W4T ~6v% @;%? c7'G<) )B8< 3.&GH<) 3:G4><) ‡,9q 7C:/N0 E'<) 78:4T 7C4Lq
*|? _l+ 34-72 7C07Œ7:'q) Bov% 7C4NU. $%&'%() 3Gl^ W4T Z75%() I)&. 7- @G< a<b
                                                        . 7C>6h _>;. ]E^ gh




                                   : # $%&
                            .,/0 $ -S #'()* +*,-

                         : 1* 23 4$%,5(/
              $()* 1758 #'()* 1.$ +)* $()* 0*,6


                   7(X,Y    7L#Z [J(( – 7T7!"I U'J         *,V
                           ^^_`ab_c`d`e`` : \']JG


By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain               3
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05



                                 : ,(g style h ,(Y/ HI[. \,IT.0i j,fg o
               . 3>>L><) 3;HL<) K5Q EY ‰en'5><) K6,<) _o)eM 1'G. Z)
                                                                    : h,k*
<p style="----style--h #'3 HI[.,fg---"> $.0G +I   J(p </p>

                         . head r) E>6? @:M 3;HL<) •hd EY 1'G. Z)
                                                                          : h,k*
<head>
<style type ="text/css">
-
-                                        style h (|},F{ ) # '3 Ny'. ,fg
-
</style>
<head>

3;HL<) •hd @- \‘7Te'6) K'.? css 3P:LM _9'5- ~4- EY 1'G. Z)
                       : 3:<7'<) 3P:L<7M 1'G. K6? rjo @- 3>>L><)

<link rel ="stylesheet" type="text / css" href = uJ( E- .css" />

      <head>------ E>6? @:M g) 3>>L><) 3;HL<) •hd EY 3P:L<) IBJ 1'G0?
                                                             </head>

3Y&N>4< „9Y )&2b 7>8Y . EN:lŒ &-) )BJ cde'>4< @:;|)? &:• ),%,G. e+ —:L<)
,J c,4/><) „9Y . R&S<) EY _:LH'<7M cde'><) 7>8:4T w&N'. w,6 @G<? 39l5><)
EY ?) 3;HL<) K5Q EY 7>J? style r) 3M7'G< r7G^) 3•j• eQ,. \%) 3Y&N-? 7>8'.˜d
                                                                     .786hd

: ,Y-SZ +w x7      )]F E5V +w style h /,I3 +g              M v7F ,/ S$!f •

a<b &:•v0 Z,G.? 3Y?&N><) html r) ‰,6? @- K6? g) _o)D EY style r) 1'G.
style r) 1'2 @.B<) @:>6,<) @:M d,L;><) {e;<) ?) 34>U<) W4T „9Y style r)
                                                     . 3.)el<) K6? _o)D EY
                                                           : 7)7y'G Jk*
<p style="---"> KL0ILM 7fTG </p>
                                                      ... 7.,6 r7p><) )BJ _4;C<


By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain              4
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05

\l%7UM 7Cl'2 K• style r) K• _>U<7M u7n<) (p) ,J? html r) K6? 1'2 ]E^ r?)
K6,<) 7C94•) K• ("-----") E0d7^†M style r) _o)eM 7- 7%&Lq K• g?75. 3-jT
3-7N<) style r) 3P:t EJ? 3U:'C< 7C4t,0 )b) . p r) K6? 7C94•)? 34>U<) 7Cl'2?
                                             . html r) ‰,6? @- K6? g) _o)D
Style = "--------------,gZ,Y• # 0( |},F{ HI[G ,fg-------------"

                                               ...   .0- 7)7y'G €0• Jk*
<h1 style = "--------------"> KL0ILM p*0/ </h1>

<tt style = "--------------"> KL0ILM </tt>

<img src ="cpu.gif" style = "------------"/>

----- Z7G- g) style r) )BJ _o)eM 1'G% Z) 1U. )b7- 7C%7Jb) W<) dD7l'. w,6 Z()
                                                . \Y&N% w,6 7- )BJ? --------
    ......... 78P:t ›Hq? 78>8Y ]zd79<) W4T _85:< ‰75+) W<) O)&:•v'<) K5+) w,6

                                                                  -: font „{
em 7>J? •7:+ E0eq? eQ,. 7CJ? „n<) KUq e.e;'< ‰en'50? : font-size
.&p2) \-en'5><) 7C<7>T7M „l0&0 78%( a<b? 3:%7p<) ‰en'5% w,6 7CJ? pt ?
? word r) _p- \-en'5><) œ-)&l<) @- &p2) EY „n<) •7:+ Feq? EJ g)
‰en'5><) KU;<) de9. Z) *:/'5. K>L><) _NU0 a<BM E8Y frontpage
              . 78-en'6) E'<) 3M7'G<) œ-)&M eq) EY \4:n'- \%( \l67C. gB<)
                                        ... 1'G0? ( font-size: ) -: 78'P:t?

<p style=" font-size : 10pt " > +/0     „{ </p>
                                                            +/0   „{   : p7If

                             „n<) },% e.e;'< ‰en'50? : font-family
                                    ... 1'G0? ( font-family : ) -: 78'P:t?

<p style = " font-family : Andalus " > +5 $LM „{ </p>
                                                                       : p7If


                               „n<) Š.&N'< ‰en'50? : font-weight
                                    ...1'G0? ( font-weight : ) -: 78'P:t?
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain                5
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05



<p style = " font-weight : bold " > ‡.0% „• </p>
                                                  ‡.0% „• : p7If
                       font-weight 1%7Q W<) bold ‰en'50 7>‘)D : ˆ82*

 . cde'><) W4T •S% ( EG< a<b? 78C:q eCT &2B0 w,6 E'<) —:L<) ŠNM eQ,.?

*:>Q 3>4G<) Bov0 Z) g) Feq)? 3P:t EY —:L<) *:>Q *>U% Z) *:/'5% 3.78C<) EY
                  . \€.&N0? \T,%? „n<) KUq g) •l6 7>:Y 7J7%&2b E'<) O7HL<)
                                                           -: 3P:L<) =lL'Y
< p style = " font-size = 20pt ; font-family = Arial ; font-weight=bold
" > KL0ILM Š,)]‹ E7(FG </p>

                                                                    : p7If
                        . ( ? ) ECN0 Fd7^() IBJ? ( ; ) K8C:M 7CN|? : ˆ82*

                                           ... Œ •J7J)G ,* €0L Ž*,3 h,k* N•f
<html>
      <head>
          <title> „{ E7(FG </title>
      </head>
  <body>

<p> 076•G   ‘7!"G ’ Œ7J% $V'. M ’#,% „• “g </p>

<p style = " font-size : 20pt " > „{ Ep8 076•G Œ7J% $V'. „{ “g </p>

<p style = " font-size : 20pt ; color : #0000ff" > 076•G Œ7J% $V'. „{ “g
•Z–M ŒL' „{ Ep8 </p>

  </body>

</html>




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain           6
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05




K< )b7>< _‘75'0 e9Y color @- œTVC0 (? a.e< 3;|)? $;lt) Fd,L<) Z) e9'T)
„9Y •490 jY 7JD&H>M 1'G0 E'<) Fe:q,<) 3>4G<) IB8Y font-color 3P:LM 78N€%
( ~n0 (? ( b),^ FeT7+ _G4Y ) FeT79<) @T Fb7^ 7J&l'T) 7J&:• eQ,. jY 78Y&Tˆ
                                             . )eQ _:4+ DeT _M F&:p2 b),^ eQ,.

                                       -: style h /,I[ +L,k Ž[— •
                             <head> r) E>6? @:M g) 3;HL<) •hd EY \'M7'2
                                                  : 7 ,I v7F ,/ HI[.
<head>

     <style type = " text / css " >
   -
   -
   - f7 * J(V 0F)G f7 * U'-       J% ,Y.0pL \ $.0L +I Š 076•I ,fg HI[L
   -
   -
   -
     </style>

<head>



By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain            7
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

           -: 7>J? style E>6? @:M O)&:•v'<) 3M7'2 1U. \%) ›q( 7.,6 a<b _4;C<
                                                            : ,J? 3.)el<) K6?
<style type = " text / css " >
                                                             : ,J? 3.78C<) K6??
</style>

r) K5Q EY g) @:>6,<) @.BJ @:M 1'2) Z) @G>. )b7-? ~:2 aCJb EY d?e. e+
       .... 3M7'G<) IB8< 3P:L<) EJ 7-? \4o)eM 1'G% Z) @G>. )b7- z&C< )b) style

*9. Z) e.&0 gB<) &:•v'<) \< *CL0 K• @-? e.&0 gB<) K6,<) K6) De;0 Z) 1U. (?)
      ....... p K6,<) @;% ’&HC< . ]E^ g) ?) h1 ?) p jp- K6,<) )BJ @G:< \:4T
                                                               : E<7'<72 1'G:Y
P     { font-size : 14pt }
w,6 3;Ht •hd g) EY \N|?? style r) E>6? @:M 3P:L<) IBJ *|? eNM 7C8Y
w,6 3;HL<) Z) g) P r) E>6? @:M *|,. {eq ?) 34>Q g) W4T &:•v'<) *9.
                         ...jp>Y 3;HL<) •hd EY 1'2 7>M F&^7l- \/M&0
<head>
    <style type = " text / css " >

       p    { font-size : 14pt }
   </style>
 </head>
<body>

<p> KL0ILM Š,7fTG </p>

</body>

EY \l'G% w,6 ]E^ gvY ¤¥ „o KU;M O7:C90 3>42 7C< &8X0 w,6 r7p><) )BJ EY
.„n<) KUq EJ? 3:t7n<) IBJ Bov. w,6 <p> r) E>6? @:M 3;HL<) EY 7C>:>L0

                             -: EJ style r) E>6? @:M 3M7'G4< 3-7N<) 3P:L<) )b)
E-' E- { (|},F{        /,I3)076,I   v7‹ }
                                                                 -:   .0- Jk*
h1    { font-family : arial , impact ; color : #ff0000 }
&>q) 78%,< Z,G. w,6 <h1>-----</h1> E>6? @:M Z,G0 w,6 34>Q g) )b)
IBJ ~|h? ( ? ) ECN0 ( ; ) Z) 79M76 7C4+ e9< . impact ?) arial „n<) },%?
              . E%7p<) •l/Y r?() eQ,. K< )b7Y ( ?) ) ECN0 ( , ) Z) 7€.) 3-,4N><)

By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain              8
                             © 2003 - 2004
              Cascading Style Sheets With HTML And Any Languages
                                    2003/02/05

em { font-size : 10pt ; font-weight : bold }
KUq Z,G. w,6 <em>---------</em> E>6? @:M 1'G0 w,6 34>Q g) )b)
                                       . Š.&T 78/o ? ¤ƒ 78/o

                          ....style r) K5Q EY 78N€%? —:L<) *:>Q *>UC< Z()?


<style type = " text / css " >

p     { font-size : 14pt }

h1    { font-family : arial , impact ; color : #ff0000 }

Em { font-size : 10pt ; font-weight : bold }

</style>

                         ... ((F( )]F J% S0". œ'- •,* €0L 2*,3 M,k* “••f
                                ... style h Ž• # ,Yv7‹ 4$.$V U'- J% œ0 If


<html>
      <head>
                 <title> E7(FI ‘7!"G </title>

           <style type = " text / css " >

              sup { position :relative ; top : -1ex }

              sub { position :relative ; bottom : -1ex}

           </style>

       </head>

    <body>

</p> 076,G ’ 07Ÿ 1* 0YˆG œ'- J(V<p>

<p> internet <sup> Arab world </sup> </p>


By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain        9
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

<p> network <sub> IT </sub> </p>

 </body>

</html>




                ... 78CN|? E'<) Fe.eU<) O7-,4N><)? r7p><) )BJ W4T 7C079:4N0 *€C<
position : relative @G< a<b EY e.eQ (? html E>6? 7>J sub ? sup
  eL9% )b7- 7-) top ? bottom ? right ? left : 3:<7'<) K:9<) 7JeNM Bov0?
@:M Fd,L;><) 34>U<) _LH0 E'<) 3q)A() d)e9- ,8Y ex Feq,M eq)? 1<75M
Œ .0- Jk* “••f ,YJ!O K!I3 +I J(p 1% <sub> <sup> h +(-
                                                                    -: 7)7y'G
sup { position : relative ; top : -2ex}

<p> internet <sup>Arab world</sup> </p>
                                                                      -: p7If
                         ª- 3Y75><)                         Arab world
                                                 internet


sup { position : relative ; top : -3ex}
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 10
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05



<p> internet <sup>Arab world</sup> </p>
                                                                   -: p7If
                                                                 Arab world

                                                  internet

•7:9<) ,J? (-1) *€% Z) EN:l/<) &-() @G< _G<) W4T •l/C. )BJ W4T •l/C. 7-?
                        -: @:N.&6 @:<7p- BovC<? \'Q7q 7C- jG< @G<? 167C><)

sup { position : relative ; top : -1ex}

<p> internet <sup>Arab world</sup> </p>
                                                                   -: p7If

                                                            Arab world
                                                 internet
sub { position : relative ; bottom : -1ex }

<p> internet <sub>Arab world</sub> </p>
                                                                     -: p7If
                                                         internet
                                                                     Arab world


                          ... sub ? sup E>6? c 3t7n<) 3-7N<) 3P:L<) )b)
Position : relative ; 3q)A‹) I7U0ˆ : 3q)A() d)e9- ex
                                                                -: ˆ82*
7>2.. 3Q7;<) 15q @:>6,<) @.BJ &:• z&o) 3>6?7M 39M75<) 3P:L<) ‰)en'6) @G>.
ª– @- &l2) 3q)A) E/N. ‚– a<B2? . ª– @- _+) 3q)A) E/N. ¤– Z) 7CXq( \%)
1<75<) @- (eM $-en'6) )b) @G<? 3q)A() OD)A 1<75<7M DeN<) D)A 7- _2 )b)
$l'2 ,< g) K:J7H><7M 3:5GT 3+jT W4T _L;0 w,5Y ª– @- reM ª+ g) 1Q,-
W<) gDŽ. w,6 ¤– @- reM ¤+ K+&Y 3+D &p2) Z,GC<? ... bottom =lL0 top
                                       ... eq)? d)e9>M I7U0() `GT 3q)A()

                                                              -: , .0- M,k*
sup { position : relative ; top : +2ex }

<p> internet <sup>Arab world</sup> </p>
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 11
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

                                                                      -: p7If

                                                            internet Arab world

}7l0) _€Y() a<B< 39:+D E0v0 ( `:.79><) Z) 7>2 K:J7H<7M cj9%) eQ,. $Xq( a4N<
                                           . 1<75<) EJ? () 780&2b E'<) 3P:L<)

34-72 7C07-,4N- Z,G0 EG< position : relative r) 3P:t W4T 7CY&N0 7C%) 7>M
•490 (?..7:‘78% 7J7C:8%)? 78CT k.e;<) 7C4>2) Z,GC< 78< 3:%7p<) 3P:L<) W4T w&N'C<
                                                    -: 7>J? @:'P:t &:• eQ,. (
                 position : absolut     position : relative

78< *‘7S<) ‰)en'6()? position : absolute EJ? 3:%7p<) 3P:L<) W4T w&N'C< )b)
7C- _G<? D,G<7M &:P0 Z) *:/'50 79M76 $4+ 7>2 7NlŒ? d,L<) W4T 7J&:•v0 ,J
              .. VUN. @< K8Y @-? })eM() a:4T $%)? =|,% 7CJ @;% g) \07-)en'6)

                                         .. Fd,L<) IB8M style r) _o)eM 1'G0?

< img src= "pic.gif" style= " position : absolute ; top : 0px ; left : 0px
; z-index : 1 " >
                                                          -: 3P:L<) IBJ _4;C<?
w,6 @.) g) Fd,L<) *+,- 78M ECN%? position : absolute 7Cl'2 ]E^ r?)
.....O7J7U0() 7Cl'2 K• IeNM E0v0 w,6 E'<) O7J7U0(7M IDe;%? ~:2? Z,G0
W4T) EY Fd,L<) *| 78M ECN% top 3>4GY (3^7S<)) 3;HL<) 3q75- @- 7Jd)e9-?
\< 7C4+ K•? W4T() @- 3;HL<) 3Y7q @T (_5GM ƒ) Fd,L<) _LH. d)e9>M 3;HL<)
3Y7q @T _5GM ƒ d)e9>M d75:<) 38Q 78N| W4T(7M 78N€0 Z) eNM g) left
                                                            . d75:<) @- 3;HL<)
IBJ? index-z : 1 7Cl'2 K• ... d75:<) W<) W4T() EY Fd,L<) *| r,9% 7C%v2?
@- &p2) 7CN|? ,< g) a<BM ECN% )b7>Y O79l/<) DeN'M =>50 E8Y )eQ 3>8- 3P:L<)
Fd,L<) style c 7CN|? ,4Y 78M u7n<) style r) Feq)? _G< *€% w,5Y Fd,t
z&o() Fd,L<) style EY 7CN|? ,<? W<?() 39l/<) 78M ECN% index-z : 1
      . W<?() Fd,L<) ‡,Y E0v0 w,6 78%) g) 3:%7p<) 39l/<) 78M ECN% index-z : 2

78+,Y *€%? Fd,t *€% Z) e.&% 7C%) 7C|&Y a< r,+) 7%) a<b Fe‘7Y 7- r,90 Z) @G>.
7:4N<) 39l/<) EY 34>U<) &8X0? W4H5<) 39l/<) EY Fd,L<) &8X0 k:;M 3:N- 34>Q
\< *€% mC<) 7-) _H6() EY 78N€% Z) e.&% E'<) Fd,L4< index-z : 1 r) 1'G:Y
                       . 79M76 I7%&2b 7- &:5H0 7- z&%? (7p- BovC<... index-z : 2
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 12
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05



<img src = " pic-gif " style = " position : absolute ; top : 2px ; right :
3px ; index-z : 1 >

<p style = " position : absolute ; top : 2px ; right : 3px ; index-z : 2 >
pc-computer </p>

                                               -: N.0- Ž[—/ h,k( “g ŽJ)f
w,6 (?) $l'2 Fd,L<) Z) 7>M `:< Z) g) D,G<) 1:0&0 K8- `:< ›q( ]E^ r?)
index-z : r) „9Y 7C>8. 7CJ . 3:%7p<) 39l/<) Z,G0 34>U<)? W<?() 39l/<) Z,G0
index-z:ª W<?() 39l/<) ECN. index-z :¤1:0&'<) `:<? 39l/<) De;. w,6 gB<)
*|,< index-z:‚ eQ? ,4Y Fd,L<) ‡,Y E070 w,6 78%) g) 3:%7p<) 39l/<) ECN.
                                                        . mC<) ?) 34>U<) ‡,Y

                                                   -: ‘!- ,* J% 2*,3 M,k*
<html >
   <head>
      <title>Š,T!" </title>
   </head>

 <body>

<p> < img src ="LOG1.gif" style =" position: absolute ; top: 0px;
left: 0px; z-index: 1" alt = "first positioned image" > </p>

<p style = "position : absolute; top: 60px; left: 15px;
     z-index: 3; font-size: 20pt; " ><b> Positioned Text </b></p>

 <p> <img src = "LOG2.gif" style = " position: absolute; top: 0px;
left: 0px; z-index: 2" alt = "second positioned image " /> </p>

  </body>
</html>




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 13
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05




‰en'5'Y postion : absolute 7-h 3q)Aj< ‰en'50 position : relative )b)
 – right – left – top ) K:9<) Z)Bov. Z7C•‹)? O79l/<) e.e;0 ? *+,><) e.e;'<
                                                                ... ( bottom
(¤) .39l/<) e.e;'< a<b? index-z : ‰en'5% position : absolute r) EY?
(¤) 39lŒ ‡,Y E070 w,6 E'<) 39l/<) ECN0 (ª) ? _H6() @- W<?() 39l/<) ECN0
39l/<) @- hel. K:+&'<) Z) g) (ª) 39l/<) ‡,Y E0v0 w,6 E'<) 39l/<) ECN0 (‚)?
        . DeN<) FD7.A 15;M 784l+ 7- E/P0 E'<)? 78+,Y E'<) O79l/<) E0v0 K• W4H5<)

E5V +w Ny'G \ 1[(. +I NO'( 7]J• ’ background Ž ¦ '• “••f
\ 1[(. +I E7T §O,fL E6 7y 0Iw (7O v7‹ Ž[ Ny œ'- style h
                                                          -: Ny'G
                          background-color : #e6e0bd
                                  . *+,><) 3:H4o Z,< e.e;'< ‰en'50?

                           background-image : url(logo.gif)
\9l6? @:6,+ @:M 1'2 Fd,L<) K6) Z) ›q(? Fd,t *+,><) 3:H4o _NU< ‰en'50?
g,';. gB<) ~4><) `H% EY $%72 ,4Y Fd,L<) *+,- D)e'-) 78M eL9%? url Fd7lT
_GS<) )B8M 1'G'Y a<b &:• $%72 ,< 7-) Fd,L<) K6) 3M7'GM EH'GCY style \:4T
_o)D D,Q,- ~4><) )BJ? pc \>6) ~4- EY Fd,L<) Z) g) url(pc/logo.gif)
ECN. a<BY url(../pc/logo.gif) 1'G0 ?) style r) ~4- W4T g,';. gB<) ~4><)
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 14
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

7>8%) g) &o) ~4- EY D,Q,- style r) Z)? pc \>6) ~4- EY FD,Q,- Fd,L<) Z)
 html r) •d7- )b) cde'><) ze< 3Y?&N- d,-() IBJ Z) e9'T) ~4><) `H% EY 75:<

                                  background-position : bottom
Z) 7C|&'Y) ,4Y a<b @- 1UN'0 ( 3:H4n<) EY Fd,L<) *+,- e.e;'< ‰en'50?
KUq s>'< d&G'0 ( Fd,t $%72?) 3;HL<) KU;M $5:< 78%) g) F&:Pt Fd,L<)
7C8Y ( IBJ eNM 7J&2B% w,6 E'<) 3P:L<) EY FV:><) IBJ w&N% w,6? 3^7S<)
&‘)V<) ='H. Z) 7>Y 3;HL<) EY Z7G- g) EY *+,>4< \'M7• 3:H4n2 78N€% Z) *:/'5%
*:/'50? 3:H4n2 I7%Deq gB<) Z7G>M Fd,L<) IBJ &8X0 w,6 *+,><) EY 3;Ht g)
@:>:<) 38Q W4T() EY 7Je.d) r,90 Z) @G>- g) $+,<) `H% EY @:J7U0) ‰en'50 Z)
                                              .. _GSM 3P:L<) 1'G% w,6 7C8Y
( ; ) g) (? )1'G% K< )b7>< $4‘750 a4N<? background-position : top right
@< )b) (? )34>U<) IBJ EY _J @:>:<) W4T) EY 78N| r,9% 7C%v2 7C%( 78l'G% K< @;CY
- left - center - bottom – top ) K:9<) 3P:L<) IBJ Bo70? ..K8C:M ( ; ) 1'G%
                                                                    ...( right

                                background-repeat : no-repeat
a<b ~:2 _‘75'0 a4N<.. d&G'0 ( 3:H4n2 7J7CN|? E'<) Fd,L<) _NQ EY ‰en'50?
*M&M Fd,L<) IBJ KUq Z72? aN+,>< 3:H4n2 Fd,t $N|? a%h ’&'Y) a< r,9%
3;HL<) s>0 Z) W<) F&^7l- d&G'0 w,6 Fd,L<) IBJ Z7Y aN+,- 3;Ht KUq
7C|&'Y) ,< @G<? ( 3;HL<) *Md KU;M 78%() O)&- *Md) d&G'0 w,6 78%) g) 34-72
@- 1%7UM „9Y &8X0 Z) 7Je.&0 a%v2 g) d&G'0 Z) Z?D EJ 7>2 Fd,L<) e.&0 a%)
EY *|,0 E'<) no-repeat d?D A&l. 7C8Y jp- 78HL'C- EY ?) 3;HL<) 1%),Q
ODd) )b) 7-) .d&G'0 Z) 7Je.d) ( r,90 a%72 g) position-repeat : no-repeat
position-repeat : .......3P:t Z) g) „9Y repeat 1'G0 Z) *:/'5'Y d&G'0 Z)
        ..d&G'0 ( 784NU< no-repeat ?) d&G'0 784NU< repeat @:4GS<) eq) Bov0

                                         position-attachment : fixed
EY W9l0 Z) 3:H4n<) 7%Dd) ,< jp>Y 3:H4n4< O7lp<) ?) 32&;<) 3Ht ]7/Tˆ EY ‰en'50?
Z) 1U:Y _H6()? W4T() W<) 3;HL<) a.&;'M mnS<) ‰7+ ,< W'q 3;HL<) _H6)
EJ ‰en'5>4< 3.˜&<) 3.78% $%72 ,< g) _H6() EY *+,><) &‘)V< F&J7¯ W9l0
rV% ,< W'q 7-) .3;HL4< \'.˜d 3.78% EY \< &8X0 Z) 1U:Y 3;HL<) ~L'C-
*- Fd,L<) i&;'0 w,6 78':9M z&:< 3;HL<) _H6) W<) scroll r7M ‰en'5><)
Z) (ˆ 7C:4T 7>Y 79M76 I7%&2b 7- B:HC0 7%Dd) ,4Y.. _H6() EY W9l0 k:;M &‘)V<) 32&q
IBJ 1'G% K< ,< 7-) .. fixed 3>4G<) position-attachment : 1%7UM 1'G%
7J)&. ( k:;M 3;HL<) _H6) EY _H6(7M $N|? ,< 3:H4n<) &8X0 w,5Y 3P:L<)

By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 15
                             © 2003 - 2004
              Cascading Style Sheets With HTML And Any Languages
                                    2003/02/05

g)) 3;HL<) 3.78C< _L. Z) W<) _H6() W<) scroll r7M rV% ,< (ˆ 3;HL4< &‘)V<)
              ..(3:H4n<) W4T style _< &:•v0 g) Z?D 3:H4n<) *|,< gD7N<) *|,<)

                          ... 79l6 O&2b E'<) —:L<) *:>Q *>U. j-72 (7p- BovC<

<html>
 <head>
   <title>ŒI/,6 7]J• Ny </title>

   <style type = "text/css">

     body { background-image: url(logo.gif);
         background-position: center;
         background-repeat: no-repeat;
         background-attachment: fixed; }

     p    { font-size: 18pt;
          color: #000000;
          text-indent: 1em;
          font-family: arial, sans-serif; }

   </style>
 </head>

    <body>
        <center><h1> windows xp </h1></center>
          <br><br>
      <p>
,g 0. NO'(J 0} © T!. ª7)/ Ž]-M,/ 0YˆG T!G 4Z'F Ž pL \        ,fO0"G h,k( “g +w
h©L ,* Ž3 Ž]-M         )]F ,/ h©f. E ' I8 ,g 0. 'Yw (ŒI.«Z H58) )]F Ž]- +w
   T!G ’ )]F ,/ h©L ,(Y* Ž]-M 1* . © +w 4Z'F K7T/ ,* Ž3 Ž]-M             )]F ,/
07Ÿ “g 1[ Œ * h©fG h©L ,* Ž[w Œ * j0)IG 4Z'F \•/ 0} ©J ¬,!"L +" . “g ŒI/,6
4Z'F $.0L h'TL ,*$f w ŒI/,6 T7G +Yw E(F( Œ*${I- ’“ ’0F! ¬ ${ 'Yw -7)‹
$FTL 1)L ,fYw ,f.$ U'J ( f ( ,/ )]F Ž]- +f L M ,fYw Z,57 1* )]F Ž]- +w
,f(Y. M “g ,Y '" Ž]-M       4$I(* )]F KL,3 'Jw ,Y 0} © .«0 !5f/ )]F Ž]-
   T!G ,* €07 )]F Ž]-        0} © h©f. \ \ # )]FJ Z,57 Ž]-•/ Œ 0YˆG \ Hp7w
  7]J{3 4Z'F Ny #'3 ,f!I3 $T N.0- Ž[—/ •'w ®,f!I3 ’“ #'[ +w ¯$)If . . ,Yf*
4Z'F ®“g Z0[IG M \ Œ7J. ’“ #'[ ,fI/,I[/ ,L#$8 E6 )]F uFIf* +w \'[G ª7)/
+G•. ,YI y +I 4Z'F \M • • Š#$8 , !i 4$8 4Z'‹ „Tw $.Z ’ )]F °(G I8
, !i ,T/,- Œf% ,f6$)G ’“ 4Z'FJ Š,!k #'3 K!I3 E6 )]F Ep8 N/Z 1* ŽO ,Y(p8
h E- 1(y ,g,f y • “ 7]J{ ,/ Œ"!G0( |},F{ J% h$G ±7‹ 1* ®,L03• ,* Ž3
‘JTG M ²Z$I( +• ... )]F ,/ 0Yˆ. œ'- ’“ |f |},F• ,L03• • • $ / body
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 16
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

Ž3 +w ‘7• • H!5G M ª7)/ ³.Z$I ,/ ,Y/ j$(L \ ,f‹08 $TJw Š,*'J ( 40k3 1*
$O E7(FG v ’ html h N* LZ,T* $V J7JO Œv7‹ ŒG,*'J * style h \´w h '8M
0Yˆ. • O'* Ž V +w +][G M ,g$8' html h,w )...KL0ILM NO '( Z'"* ’ ,Y •0"I.
               ...( / “V .0)- Š,5( Œ N•G Œf.©G •J p. style h,w ‘}2 Ž[— ,/
     </p>
     <h1> MST </h1>

 </body>

</html>




  -: ( order & unorder list) \l0&><) &:P<? \l0&><) K‘),94< style r) K:>L0 o
—:L<) @- 3P:t g) 7-h 79M76 O&2b E'<) —:L<) `H% 78< 7C>:>L0 EY ‰en'5%
Fe.eU<) (3:t7n<)) 3P:L<) @G< \M u7n<) \>:>L0 7C- jG4Y a< 72?&'- )B8Y 39M75<)
                                                          -: EJ K‘),9<7M 3t7n<)
@- 3;HL<) 3Y7q @T 3>‘79<) 3M7'2 eNM 78M eL9%? Margin-left : 75px
Feq,<) IBJ?) _5GM °± d)e9>M 3Y7;<) IBJ @T mC<) eN'l. Z) k:;M @:>:<)
                        .. E<7'<) _GS<) &X%) d75:<) I7U0†M (7CJ 3-en'5><)




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 17
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05


       w,8 ®“g \ ·0]L
      .Z,57 1* )]F
                                 1- PC-PARTS
        h +g ®“g
                        d            a- CD-ROM
        Margin                       b-CPU
        ..…Left
      75 Z $T(/         a        2- INTERNET
       !5f/ Ž5[/
      ,YJ!O ,* J%
                     @- mC<) _LH0 E'<) 3Y75><) 78M ECN% margin-left )b)
E8Y 7C< 7-) mC4< 3l5C<7M d75:4< EJ )b) ) 7C< 3l5C<7M `:<? mC4< 3l5C<7M d75:<) 38Q
Feq? @- (eM _>N'50 Z) @G>. 3:t7n<) IB8< 3l5C<7M F&:o) 3-,4N-? ..( @:>:<)
                                                     .cm &'>'C5<) Feq? px_5Gl<)

3Y7q EJ? 784l+ 7- @T °± d)e9>M 3q)A) OBo) ª ? ¤ 3>+&><) 3>‘79<) : 3Xqj-
@- °± d)e9>M 3q)A) OBo) e9Y b ? a c $>+d E'<) 3>‘79<) 7-) z&5:<) 3;HL<)
de90 3q)A() Z) g) eL+) )b7- $>8Y a%) e9'T) . ª ? ¤ 3>+&><) 3>‘79<) g) 784l+ 7-
EY margin 1'G0 Z) aCG>. \%) 7>2 ... 3;HL<) 3Y7q @- 7>‘)D `:<? 784l+ 7- @-
? margin-bottom ? margin-top @G>- g) O7J7U0() @- —:t FeT
O7+?[) &p2) ‰en'5% K‘),9<) EY 7CCG<? ‰)en'6() 15q a<b? margin-right
Z,G0 7-eCT margin-right ? 3.V:4U%() 3P4<7M K‘),9<) Z,G0 7-eCT margin-left
                                                            . 3:M&N<7M K‘),9<)

<html dir = "rtl ">
     <head>
         <title> E} 'T </title>

      <style type= text/css >

             ul { margin-right: 75px ; color : #ff0000 }
             ul ul { margin-right : 15px ; color : #0000ff }
     </style>
</head>

<body>
<H1>KL0ILM </H1>
 <UL>
    <LI>Š,30X NO '*
    <LI> 7F{X NO '*
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 18
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05

       <UL>
             <LI> 7Y7w0G
             <LI> 7(J%
             <LI> 7L2% </LI>
       </UL>
   <LI> .Z,!•& NO '*
   <LI>$.0/ NO '*</LI>
 </UL>

</body>
</html>
7CJ .a|&'N0 e+ E'<) K:J7H><) ŠNM =|,C< Fd,L<) W<) &XC% Z) _l+ D,G<) _4;C<
  ........ E<7'2 $l'2 E'<) 3P:L<7M aN- _Lq `l4<) Z) e9'T) @G<? =|)? ]E^ _2
?) •:l/'<) )BJ BHC. Z) e.d) r,+) EC%v2 7CJ ul ul { margin-right : 15px }
•l/. @< (ˆ? ´&S<) )BJ &Y,'. Z) 1U. g) 3>‘7+ 784o)eM 3>‘7+ O]7Q )b) D,G<)
\< $;'Y K• W<?() 3>‘79<) @>| $%72? 3:Ln^ *+),- $4+ EC%) $XqjY D,G<)
´&S<) ]7Q 7CJ )b) 3:%jT) ? 3:>4T ? 3:8:Y&0 W<) 3:LnS<) *+),><) ~CL0 3>‘7+
~:CL0 Z) g) K‘),9<) IB8< F&^7l- D,G<) •lŒ a<B< 3>‘7+ _o)D 3>‘7+ g) 79l/-
3>42? 3:LnS<) *+),><) 3>42 @- _5GM ¤± 3q)A) d)e9>M ]7Q 3:LnS<) *+),><)
WC>:<) 3;HL<) 3Y7q @- _5GM °± 3q)A) d)e9>M O]7Q 785H% 3:LnS<) *+),><)
Z),<() •:l/0 W<) 3Y7|) .. „9Y Feq)? 3>‘7+ g) 78M u7n<) D,G<) 78:4T •lŒ 78%(
                                                              .. Feq)? _2 W4T




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 19
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05




                         -: ,Y7J% style h ‘7!"G ( link ) 7! —I Š2‹'

                                        a { color: #0000ff }
78%,< =lL. w,6 ( link) 3:lNS0 34t? g) Z) W<) gDŽ0 w,6 3P:L<) IBJ?
                                                             .‡dA)

                                   a: hover { color: #efb026 }
&8X. w,6 •?7><) 785-j. Z) D&U>M 3:lNS0 34t? g) Z) ECN0 3P:L<) IBJ?
79l5- I7%Deq gB<) ‡dA() Z,4<) @- 78%,< &:P'. w,6 g) E<790&l<) Z,4<7M 78%,<
34t,<) @T •?7><) eN'l. Z) D&U>M @G< .. E<790&l<) Z,4<) W<) 3:lNS'<) Ojt,4<
   ‡dA() Z,4<) g) 3:lNS'<) Ojt,4< I7%Deq gB<) 78%,< W<) 34t,<) *Q&0 3:lNS'<)


                                       a: active { color: #ff0000 }
_l+ \/P€2 ) •?7><7M 78:4T „P€0 w,6 3:lNS0 34t? g) Z) ECN0 3P:L<) IBJ?
‡dA() Z,4<) @- &:P'. w,6 78%,< Z) g) &>q() Z,<) 78%,< =lL. w,6 ( r,oe<)
I7%Deq gB<) &>q() Z,4<) W<) K• E<790&l<) Z,4<) W<) 3:lNS'<) Ojt,4< I7%Deq gB<)
                                                                         .. 7CJ

                                      a: visited { color: #ab1784 }
Z,4<) 78%,< =lL0 w,6 780d7.A K0 3:lNS0 34t? g) Z) 3P:L<) IBJ ECN0?
78%,< &:P'M a<b? _l+ @- 34t,<) IBJ $4oD a%) &‘)V4< r,9% 7C%v2?) ge-&9<)
=lL:< 3:lNS'<) Ojt,4< 79l5- I7%Deq gB<) ‡dA() Z,4<) EP40 78%) g) .\':lp0?
 .(780d7.A K0 E'<) 34t,<) g) Z,4<) )BJ W4T „9Y 34t,<) IBJ $lp0? )ge-&9<) Z,4<)

\%( 7CJ \0&2b ECCG<? m% g) W4T \9l/% Z) @G>. K:>L0 &2b) Z) D?) 3.78C<) EY
,J? 3:lNS'<) 34t,<) $;0 „o *|? ,J? 3:lNS'<) Ojt,<) EY ‰)en'6‹) *‘7^
_o)D \-en'6) w,6 7CJ ECCG< html r) ‰,6? @- K6? g) _o)eM E<7'2 1'G.
                                            : ,J? 3:lNS'<) Ojt,<) 3P:t
                         a { color: #0000ff ; text-decoration: underline }
784G^ =lL. g) „o 78';0 *| ? ‡dA() Z,4<7M 78N| 3:lNS0 34t? g) Z) g)
                                                            -: E<7'2
                                             EM&N<) c,67;<)


By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 20
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05

                               -: Eg h,[X 4$% J% +G•G \ 1[(. 7‹,{ ®“g
 3>4G<) $;0 „o *|? e.&0 $C2 )b) : text-decoration: underline
  . 3>4G<) $;0 „o *|? ‰eT e.&0 $C2 )b) : text-decoration: none
‡,Y „n<) &8X. Z) e.&0 $C2 )b) : text-decoration: overline
                                                               . 3>4G<)
EY „n<) &8X. Z) e.&0 $C2 )b) : text-decoration: line-through
                   . <blink> ,J? html K6? $l'2 a%v2 g) 3>4G<) ~LC-
-:E<7'2 EJ? _l+ @- 7J&2B% K< 3P:t 7€.) &2BC<. text r) O)&:•v0 7%&2b 7C%) 7>M?
(eM 3:<7'<) K:9<) Bov0 Z) @G>.? W4T(7M mC<) *| ECN0 gBJ? text-align : top
                               ...( center – bottom – right – left ) top @-

                                             ...®,L03• ,* J% 2*,3 M,k* “••f
<html>
     <head> <title> 7! —I Š2‹'          J% Š 076•G </title>

             <style type = " text/css ">

                a { color: #0000ff ; text-decoration: none }
                a: hover { color: #efb026 ; text-decoration:
                  underline }
                a: active { color: #ff0000 }
                a: visited { color: #ab1784}
                p { color: #ff0000 ; font-weight: bold}

              </style>

      </head>
  <body>
   <p> .Z,!• NO '( 7! —G Š2‹ </p>

   <a href=" http://www.cnn.com " alt= "NEWS"> CNN
    NEWS </a>

   <a href=" http://www.bbc.com " alt= "NEWS"> BBC
    NEWS </a>

   <br>

   <a href=" http://www.aljazera.com " alt= "NEWS">
    ALJAZERA NEWS </a>

By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 21
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

 </body>
</html>


                                          ... _:4;'< µ7';. ( r7p><) )BJ Z) e9'T)




r) K>L0 a%) ,J? K8- r)Ž6 a<7lM &/n. K<h •l6 7- _2 R&^ K0 7- eNM @G<?
eQ,.? p K6? &2b 7- _2 Z) ECN. )B8Y p r) K6,< ’&HC< jp- @:N- K6,< style
@G< style r) EY \< 78'>>t E'<) O7HL<) Bov. w,6 ]E^ g) ?) m% \4o)eM
O7HL<) IBJ Bov. ( p r) K6? _o)eM 1'2 m% g) _NU0 Z) jp- e.&0 a%) ’&HC<
e.&0 Zv2 3>>L><) 3;HL<) EY $%72 E'<) u,LC<) *:>Q 780Bo) E'<) O7HL<) g)
g) K6,<) a<b `HCM $N|? E'<) u,LC<) 3:9M @T „9Y O)B<7M mC<) )BJ V:>0 Z)
`H% @:M 1'G0 E'<) u,LC<) 3:9M @T ~4'n. Z) O)B<7M mC<) )B8< e.d) r,90 a%v2
                        ... _;<) ,J 7- z&C< ¶ \4GS><) IBJ _p>M _>N<) 7>Y K6,<)

$5:< aM 3t7o 3P:t K>L0 Z) *:/'5'Y style sheets r) 3%?&- A&l0 7CJ
@- K6? g) W4T •:l/'<) a<b g&U0 Z) ODd) )b) a:4T 7- _GY K6? gvM „l0&-
K>L. ~:2 z&C< a<b ~:2 html r) K6? _o)D \>6) ETe'50 Z) html r) ‰,6?
                                                      .. WTe'5. ~:2?


By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 22
                             © 2003 - 2004
              Cascading Style Sheets With HTML And Any Languages
                                    2003/02/05

.my-style { color: #ff0000 ; font-weight: bold }

                               )ŒO'L \ $.0L +I Š,]F
   +w Œ"TL N•L                 ‘7!"I J%
     v7F E- h
       \ $.0L +I
           ,Y((FL        Œ7%$I5L œ'- +I   v7F E-
                                            $ / ,(7w

3/9% \4l+ *|? ieCT @- K6) g) 1'2) K6,<) K6) 1'G0 Z) @- reM a:4T 7- _2 )b)
                                                                          .(.)
?) K:>L'<) a<b \:4T *9. Z) e.&0 K6? g7M De;0 Z) a:4T 7- _2 ..¶\:Te'5% ~:2
<h1> r) E>6? @:M O]7Q E'<) Fd7lN<) W4T \N+,0 Z) e.&0 a%) ’&HC< &:•v'<)
&:•v'<) ?) •:l/'<) ,J my-style I7C:>6) gB<) ‡,Y I7C>>t gB<) K:>L'<) Z72?
                           :- E<7'2 \'M7'2 \4NY a:4T 7- _2 )b) \+,% Z) e.&% gB<)
<h1 class = " my-style " > ,fg 076•I ‘!". œ'- </h1>
                          -: E<7'2 \'l'2 ?) \'>>t gB<) &:•v'<) ]7Te'6) 39.&Œ )b)

class = " ŒI. $!/ +I   "Tf 07Ÿ 1* ŒI((‹ ’“ E7(FI E- "
                       ... e.&0 K6? g) _o)D @- Z,G. Z) 1U. ]7Te'6() Z) ›q(

                                                              .. 2*,3 M,k* “•,f
<html>
      <head> <title> 076•I ¾,%$I- </title>

         <style type ="text/css">

         h2 { font-family: arial ; color: #c9ccf2 }
         p     { font-size: 14pt ; color: #17982d }
         .red { color: #ff0000 ; font-size: 16pt }
      </style>
    </head>

  <body>

 <h2>E-' “g 17/ Ny'. \ 'f% ’M #$8 ’“ 076•I Œ7J% 0Yˆ. œ'-</h2>
 <br>
 <p> E-' “g 17/ |L ’M #$8 ’“ 076•I Œ7J% 0Yˆ. œ'- </p>
 <p class = "red" > 17/ HI[. |L ’M K y +I Š 076•I |f “g J% 0YˆG 1
E-À $f- ’“ E7(FI 076•G Œ7J% 0Yˆ. œ'- Ž/ E-' “g
red</p>

By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 23
                             © 2003 - 2004
           Cascading Style Sheets With HTML And Any Languages
                                 2003/02/05

 <body>
</html>




                       -: style h +w EYI* ${I- span div 1.0Ff
@:M ]E^ g) ?) m% ?) &-) &L;% Z) e.&% Z) _l+ Z7-en'5. Z)&LCN<) Z)BJ
@- @:>6,2 7>J&2B% Z) @G>. 7C8Y 78:4T wd7N'><) html r) ‰,6? &:• @:>6?
IB8M Z7l'G. g) 784o)eM class r) ETe'5%? &:lN'<) A7Q )b) html r) ‰,6?
                                                              .3P:L<)

<span class ="red”> ®,f(‹ ’“ 076•I ,/ |f 06•I. œ'- ,fg </span>

<div class ="red”> ®,f(‹ ’“ 076•I ,/ |f 06•I. œ'- ,fg </div>


                                       -: ,Yf* h,[X 4$ / \,7G•. \ 1[(*

<style type ="text/css">
   span { background-color: #ccffcc ; font-size: 18pt }
<style>                  Š“•
                           076•I

<span> ¾,%$I- x7 Œ/ ‹,• Š 076•G ,f y ,fg </span>

By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 24
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

k.e;<) )BJ? div _< 1'G. span _< 1'G. 7- _GY div _< 3l5C<7M r7;<) a<B2?
                   -: EJ? @.&LCN<) @.B8< m‘7Ln<) ŠNM &2B% Z) W<) 7%D,9.
                                      -: margin-top : .5em
margin- ? margin-bottom ) g) O7J7U0j< _G^ @- &p27M E0v0 Z) @G>.?
EJ 7- 7-) )eQ 39:+D Feq? EJ? em Feq,<7M •790? ( margin-right ? left
3Y7;<) g) mC<7M @:Œ7;><) d7Œ‹)? ·-78<) eNM E0v0 E'<) 3Y75><) d)e9- ECN'Y
Z) @G>.) ( margin r) 1%7UM d,2B><) I7U0() 15q) µd7n<) @- 3Œ7;><)
margin: ) 3P:L<) IB8M 7Jeq,< margin r) 1'G0 7-eCNY (O7J7U0() _2 _>N'5%
rjo @- &p2) =|,% w,6? O7J7U0‹) *:>Q @- .5em 3Y75- Bov. (.5em
                                                       . _H6() EY _GS<)

                                         -: padding-top : .5em
? padding-bottom ) g) O7J7U0j< _G^ @- &p27M E0v0 Z) @G>-?
34t7H<) 3Y75><) E8Y 78M ECN% )b7- 7-) ( padding-right ? padding-left
Feq,M •790? mC4< 39tj><) (@G>-) 1%),U<) *:>Q W'q ?) 1%),U<) @- 1%7U<
_2 _>N'5% Z) @G>.) \J7U0†M j2? mC<) r,q ·-),8<) g) 7€.) em r)
 ( padding: .5em ) _GS<) )B8M 7Jeq,< padding r) 1'G% 7-eCNY (O7J7U0()
_GS<) rjo @- &p2) =|,% w,6? O7J7U0() *:>Q @- .5em 3Y75- Bov. w,6
                                                            . _H6() EY


   margin              .5em
                                            ’ 4Z'F         |f
   boder                                    ( center )..0• ¾+X

  padding




                                                         -: float: left
w,6 E'<) 38U<) ECN0 EJ? float : right ,J? &o) _G^ W4T E0v0 Z) @G>.?
Z) w&T) .\.,';0 7- _GM g) 34-72 78'q75- g) span ?) divr) 3q75- 78M Z,G0
7- K8H0 w,6? (7p- Bov% w,5Y •490 ( @G< c,4/><) K8Y EY j:4+ 7CJ 1Nt &-()
left ?) clear : right 1'G.? @:J7U0() `H% Bov.? clear &LCT eQ,. 7>2 1'2
&:• F&:o() 3P:L<) IBJ? d75:<) ?) @:>:4< \:4T Z72 7- W4T D,N. Z) ECN. )BJ?
      .]ES<7M K4N<) c7M @- 7CJ 780&2b @G<? &:lN'<) A7Q )b) _:4+ _GSM (ˆ 3-en'5-
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 25
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05




       Â div span h 17/ • •0] ,* ¬'y'( ,/ ¾+X EgM \M +G•f o
)bˆ *:/'5% @G< d,-() a:4T „4'n0 ( EG< K8C:M ‡&H<) O7J7'>M _oe% Z) e.&% (
&:•v'<) 78< _>N0? &/6 rVC0) ~+,0 _>N0 div Z) ,J ‡&H<) r,9% Z) &:lN'<) A7Q
~:2 .. &>'5'Y span r) 7-) 7JeNM E0v0 w,6 E'<) D),2() W<) 3l5C<7M ( u7n<)
                                                                      ¶ a<b
                                             .. *.&5<) r7p><) )BJ W<) &XCC<
<style type =”text/css">
p     { color :#ff0000 }

div   { color: #0000ff}

</style>          076•I
                  J% NT.

<p> E-' “Y ®,f((‹ ,(3 076•I ,Y7J% “]f. œ'- J(p ®“g +w
<div> E-' “Y ®,f((‹ ,(3 076•I ,Y7J% “]f. E6 J(p ®“g +w 0"- h©f. œ'-
                                                           ..0"- h©f. E6
</div>
1(y 1[ ( p ) E-' ,g,f((‹ +I (¦ '{ ) Š 076•I ,Y7J% ‘!". œ'- J(p ®“g +w
Ž3 \ ’ 17IT/,5 17IJ(p 1* ,YT!- ,* N* '‹'* +G•G 1 J(p \ ’ $.$V 0"-
                                             . 0"- +w \'[G œ'- Ž(p 1* J(V
</p>
                                                 ... + ,I3 0YˆG œ'- p7If

                   K6,<) )B8< I7C>>t 7>2 &:•v'<) 78:4T *+,. w,6 34>U<) IBJ EY
..0"- h©f. E6 E-' “Y ®,f((‹ ,(3 076•I ,Y7J% “]f. E6 J(p ®“g +w 0"- h©f. œ'-

( p ) K6,< 7J7C>>t E'<) (u),n<)) O)&:•v'<) 78:4T •l/. w,6 34>U<) IBJ EY
@:'4>U<) @- 789l6 7- *- 3<,t,- E0v0 @< 34>U<) Z) g) e.eQ &/6 @>| @G<?
                        &/6 EY Z,G0 w,6 _>U<) @- 34>Q _2 Z) g) @:'9M75<)

                                                               -: ˆ82*
*- 3<,t,- E0v0 K< 78CG< p K6? @>| $%72 $9l6 E'<) _>U<) *:>Q Z) ›q(
K• W<?[) 34>U<) W4T •lŒ p r) K6? Z) g) 7JD&H>M F&9Y _2 O]7Q _M 78€NM
*|,<)?) \>6? •4P.? 78C- )]VQ Bov:< div r) K6? 34>U<) ~L'C- ’&'T)
g) \9l6 gB<) &/5<) `H% EY div r) K6? @>| gB<) mC<) 1'G. Z) EN:l/<)
Z) _M _L;. K< a<b @G< eNM •4P. K< p r) K6? Z( a<b? p r) K6? W4T g,';><)
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 26
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

.. &/6 rV% K• ( div K6,< g) ) 78M u7n<) &:•v'<) •lŒ? &/6 $<V% 34>U<)
EY @G< 34>U<) IBJ $l'2 div r) K6? •4• eNM @G< 34>U4< 3:9M i7CJ Z72 7NlŒ?
•4•) K• 7J79l6 @.B<) @.&/5<) `H% @>| E0v0 Z) @- (eM 78M u7o e.eQ &/6
                                                              .. p r) K6?

              span h,/ 1[ h,k( x]L HI[f



<style type =”text/css">
p       { color :#ff0000 }

span { color: #0000ff }

</style>
                        076•I
                        J% NT.



<p> E-' “Y ®,f((‹ ,(3 076•I ,Y7J% “]f. œ'- J(p ®“g +w
<span> E-' “Y ®,f((‹ ,(3 076•I ,Y7J% “]f. œ'- J(p ®“g +w </span>
0"5 x]L 1(y 1[ .. ( p ) E-' ®,f((‹ ,(3 076•I ,Y7J% “]f. œ'- J(p ®“g +w
              . ,YIT!- 17IJ 17IJ(pJ 0"5 x]L 1(y +G•G œ'- J(p ®“g \ ’
</p>

                                                                        -: p7If
w,6 34>U<) IBJ EY K6,<) )B8< I7C>>t 7>2 &:•v'<) 78:4T BHC. w,6 34>U<) IBJ EY
7>2 &:•v'<) 78:4T BHC. w,6 34>U<) IBJ EY K6,<) )B8< I7C>>t 7>2 &:•v'<) 78:4T BHC.
@>| E0v0 w,6 34>U<) IBJ Z) g) &/5<) `H% @>| @G<? .. ( p ) K6,< I7C>>t
                                              . 78'9l6 @:'4<) @:'4>U4< &/5<) `H%

                                                                  :- ˆ82*
7C8Y ...IBJ 3U:'C<)? div c 3t7n<) @:'9M75<) @:'U:'C<) @:M wj'o‹) $Xq( a4N<
                          .. 34>Q _G< e.eQ &/6 eQ,. ( g) \€NlM (,t,- ]7Q

                                                        .. 0• , .0- M,k* “•,f

<p>KL0IL <span style =” color: #ff0000”>KL0IL </span>KL0IL </p>
                                                              -: p7If
                                                               $%&'%7'%&'%7'%&'%)
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 27
                             © 2003 - 2004
           Cascading Style Sheets With HTML And Any Languages
                                 2003/02/05



<p> KL0IL <div style =” color: #ff0000”> KL0IL </div> KL0IL </p>

                                                                 -: p7If
                                                                   $%&'%)
                                                                   $%&'%)
                                                                   $%&'%)

                                          ... =|?) _GSM ‡&H<) $Xq( a4N<

                        ( ‰7T _GSM ) -: div ? span @- _G< \4-72 \4p-) BovC<

<html dir="rtl">
 <head>
   <title>div</title>

   <style type = "text/css">

     div { background-color: #ffccff;
         margin-bottom: .5em }
   </style>

 </head>

 <body>

   <div style = "width: 10%"> )]F Ep8 1* %a^ J(p ®“g “••G œ'- ’
</div>

   <div style = "width: 30%; text-align: center">
    X,— Ep8 1* %a^ ,gZ $T* 8,5* “••. ª7)/ uFIf( ,/ |f Ž p. œ'- ,fg
e^ +g Œ FF{( 8,5( \M 40X,!* 0"- h©f. œ'5w |f # $I* • • 1% # – •´w
 X,— Ep8 1* %</div>

   <div style = "width: 20%; height: 30%; overflow: scroll">
    %a^ Z $T(/ ·0     ¬,]GZM ª78 1* 8,5( \'[G \ Š#$8 J(p ®“g +w ,fg
Z,! Z'Y• N* X,— Ep8 1*</div>

 </body>

</html>
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 28
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05




                                                    ... 7.,6 r7p><) )BJ _4;C<
e^ \%) e9'T) @G< a.e< =|)? ]E^ _GY cde'><) Eo) a< e.eQ eQ,. ( e9'T)
K>t) K• 3;HL<) •hd EY div _< style r) K>t) ~:2 ,J 7>8<?) @.&-) aJ7l'%)
a< $4+ 7%) cde'><) Eo) 3;HL<) K5Q EY div r) K6? _o)D div _< style 7€.)
•hd EY K:>L'<) @- )]VQ $l'2 7%7Y D,G<) 3M7'2 EY \'9.&Œ 7C- jG< Z) 79M76
EC%) c7M @- _M klN<) c7M @- `:< )BJ? div r) K6? _o)D \C- )]VQ? 3;HL<)
@;CY Feq)? 3;Ht EY @:'9.&/<) *>U% Z) @G>. \%) EJ? 3-,4N- a< _t?) Z) e.d)
jY a<b @- $UTV%) $%) )b)? a< i?&'- &-()? ..a<B2 `:<h @:'9.&/<) 7C>4N0
‡,Y $%) \l'2)? 7CJ D,Q,- &:• div K6? _o)D D,Q,><) D,G<) Z) &l'T) a:4T
EHY a:4T ( œ07C<) `H% E/N. w,6 3;HL<) •hd EY D,Q,><) r?() 1%7UM
78N>U. 3.78C<) EHY 39.&/<) $%72 7>8- 78N:>Q O)&:•v'<) •l/0 w,6 @:'<7;<)
                                                            . 78N:>Q 78N€.?
KN% overflow: scroll D,G<) )BJ D,Q? ,8Y aJ7l'%) e^ gB<) E%7p<) &-() 7-)
*€0 Z) ODd) )b†Y a07-,4N- W<) 78H|) )b) a:4T Fe.eQ 3P:t IB8Y cde'><) Eo)
„9Y 3P:L<) IBJ 3M7'2 (ˆ a:4T 7>Y ( scroll ) – span r) ?) div r) 3q75><
                                              . 78>6) @- 3;|)? 78%) *+,0)?




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 29
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05

                                                                      : ˆ82*
_9•) Z) e.d) ( 7%7Y 79M76 a< 39M75<) 3P:L<) g&2b ‰eT @- œTVC0 ( cde'><) Eo)
3P:L<) K8H0 )BGJ \'+? ]E^ _G< @G< _>- )BJ 7%) K4T) 7%7Y ›H;<) F&pGM a:4T
                                             .. „9Y 78XH;0 a%) @- _€Y) 78XH;'Y

        .... a< 72?&'- \4:4;'Y a< Z7;'-) I&l'T)? spanr)? div r) W4T &o) (7p-

<html dir="rtl">
 <head>
   <title>div & span</title>

   <style type = "text/css">

     div { background-color: #efefef;
         margin-bottom: .5em;
         font-size: 1.5em;
         width: 50% }

     p { text-align: justify; color:#ff0000 }

    </style>

  </head>

 <body>

   <div style = "text-align: center">
    ²0 \ Z'"( </div>

   <div style = "float: left; margin: .5em;
    text-align: right">
    j07Ÿ x7 M U ¬$!G \ N7"I5G Žg #$). \ N7"I5. ’“ $78' KL </div>

   <p>
  ’Z'"* 1* \'[G \ +w -("G Kf3 • ²Z$I( +••w ŒGZ$O ŒG,. 'g Œ8'(i ,f* 2[
  ’•w ®,f(IG ,* Ž7L J% j$%,5f ,fg 1)fw • • +w ##0IG 2w Œ*$TG J% 17J*,  KL0ILM
                                    ,YJ(3•/ *S H5[* Œ!5[* \'[. Œ ŽFL +/0% U$TG
    </p>

   <div style = "float: right; padding: .5em;
    text-align: right">
    KL0ILÄ NO '* 0.'"G E7(FG</div>
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 30
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05




   <p>
        •G,)]F ‘L 0 h,(p 0)5 w,y& 7]73 J% ²Z$I( +• EJ IG œ'- ,fg
Ž!O 0!F Š03• $T EJ I $ / ¬ $/M 07[]I 1* 27JO 07F 1* 27JO 'g •7J% ,* Ž[w
                                     ¬ $/M ©7(IJ h'‹' Å,I]* 'Yw ¾+X Ž3
    <span style = "float: left"> welcome to cascading style sheets
</span></p>

  </body>
</html>




W4T 39l/><) ?) 3N+),<) ( m‘7Ln<) ) O)&:•v'<) EJ 3-,4N- &o) 7C.e< E9M Z()
                                                    : (border) O)d7Œ‹)
w&N0 w,6 d,L><) r7p><) W<) &XC0 Z) D&U>M $%7Y a< 78Ht) Z) *:/'6) (?
?) (border) d7Œ‹) a>6 r7G^) @- _G^ g) 3:4G^ E8Y 78C- Feq)? _2 _G^
                                                                . \>:>L0

                                                     -: ,Y *, ±7F
                                     -: \<7G^)? border-width :
                                     border-width : thick o
                                  border-width : medium o
                                      border-width : thin o
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 31
                             © 2003 - 2004
             Cascading Style Sheets With HTML And Any Languages
                                   2003/02/05




                                          -: 78<7G^h? border-style :
                                        border-style : groove o
                                          border-style : inset o
                                         border-style : outset o
                                          border-style : ridge o
                                           border-style : solid o
                                          border-style :double o
                                                        border-color:
border- _GS<) )B8M 1'G0 )b) D,6() Z,4<) ’&HC< Ie.&0 Z,< g) \l%7UM *€0?
                        ...Ie.d) gB<) d7Œ‹) Z,< \M eL+) )BJ? color: #000000
r7p><) )BJ @G:<? 79M76 78< 7C+&/0 d7GY) FeT \M *>Q) w,6? j-72 jp- BovC<
                                           -: •M75<) EY \< 7C+&/0 7>T 7C< 3NQ)&-
                                                                       : 3Xqj-
K:XC'< Fe:Q 39.&Œ E8Y class r) g) ]7Te'6‹) W4T K‘7+ )BJ 7C<7p- _NQ) w,6
                     ... 78< 7C07>:>L0? 7%d7GY) },C0? O)d7Œ¹< 7t,Lo? 7%d7GY)


<html >
 <head>
   <title>borders</title>

    <style type = "text/css">

      body { background-color: #ccffcc }

      div   { text-align: center;
            margin-bottom: 1em;
            padding: .5em }

      .thick { border-width: thick }

      .medium { border-width: medium }

      .thin { border-width: thin }

      .groove { border-style: groove }

      .inset { border-style: inset }
By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 32
                             © 2003 - 2004
              Cascading Style Sheets With HTML And Any Languages
                                    2003/02/05


     .outset { border-style: outset }

     .orange { border-color: orange }

     .black { border-color: black }

   </style>
 </head>

 <body>

   <div class = "thick groove">This text has a border</div>
   <div class = "medium groove">This text has a border</div>
   <div class = "thin groove">This text has a border</div>

   <p class = "thin orange inset">A thin orange line...</p>
   <p class = "medium black outset">
    And a thicker black line</p>

  </body>
</html>




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 33
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05

                       -: style h ,Y/ HI[. \ 1[(. T.0i 0• ,f7J% +T/ • o
1'G0 Z) e.&0 ( a%) ’&HC< 7CJ Fe.eU<) F&GH<) @G< 79M76 I7%&2b 7- _2 •lŒ 7CJ
D,G<) 1'G0 Z) e.&0 ( g) a';Ht `H% EY (styler) D,2 g)) style _< a>:>L0
<head>--- r) E>6? @:M 3;HL<) •h&M html r) 3;Ht EY style r7M u7n<)
\:4T &:•v'<) •:l/0 c,4/><) K6,<) _o)D EY 3;HL<) K5Q _o)eM (? ---</head>
W4T g,';0 „9Y g) 3t7o 3;Ht 78< e.&0 a%) g) <p style------->------</p>
        ... ( css ) D)e'-†M 78C.Vn0? 78>:>L0 ,J a:4T gB<) _2 )b) style r) D,2

:7>J? style r) E>6? @:M d,L;- Z,G. Z) &:• @- style r) D,2 1'2) @G<
<style type ="text/css”>
.
.
</style>
                             .. 0k3 -y'f Ž7JO $ / M,k* “••L œ'- #'[ HI3 „Tw

@:M g) html r) 3;Ht •hd EY ‡,Y D,G<) )BJ 1'G0 Z) 1U. E%7p<) ES<)
 D)e'-†M I7%vS%) gB<) style r) ~4- ]7Te'6ˆ D,2 )BJ? ) )BGJ head r) E>6?
                                                                 .. ( css
<head>

<link rel =”stylesheet" type ="text/css" hreaf=” uJ( E- .css" />
</head>
a07;Ht ?) html O7;Ht \M eQ,. gB<) ~4><) `H% EY Z72 ,< \N€0 ~4><) K6)
=:;L<) ID)e'-) *€0 a%7Y &o) ~4- EY g) a<b &:• Z72 ,< 7-) 3P< gvM 3>>L><)
                 ...( src =---) d,L<) ]7Te'6) 3:H:2 c7'G<) r?) EY 7%&2b 7>2
                                                                   :2*,3 M,k*

P        { color: #ff0000 }
Em       { color: #ffffff ; background-color: #000000 }
.key1    { color: #000000 }




,fLS ·0]f (css ) # $I*´/ ®,fˆ]8 ®,f!I3 \ $ / style h uJ( ,f(7(FG “g \ ·0]L
,fI)]‹ Œ/ $V'G œ'- ’“ uJ( x]L +w ®,fˆ]8 ,fL ·0w J% mystyle.css ®,f7(-
                                      ... €0• v ’ html h,/ ,Y((FL œ'- +I
          ..... style h 17(- 17/ ,(g0F8 E style h #'[ +I/,I3 \ Æ8M : ˆ82*


By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 34
                             © 2003 - 2004
            Cascading Style Sheets With HTML And Any Languages
                                  2003/02/05

                                              -: html h )]‹ E7(FG o
<html dir="rtl">
      <head> <title> KL0ILM Š,7fTG HI3 J5J-</title>

     <link rel ="stylesheet" type ="text/css" href =" mystyle.css" />

    </head>
 <body>
 <p> +/0 Z'"( ®'V0. ,* Ž3 J% ’'I)G œ'- KL0ILM Š,7fTG HI3 J5J-</p>

 <p class="key1"> \ Z'"( Š,7)G N*</p>
 <p> <em> MST</em> </p>

  </body>
</html>




By Sami AL-Rabai3h Help With : Thamer Mohammed & Mahmoud Hussain 35
                             © 2003 - 2004

				
DOCUMENT INFO
Shared By:
Stats:
views:80
posted:1/13/2011
language:English
pages:35
Description: كتيب تعليم لغة برمجة الستايلات لصفحات الويب CSS خطوة بخطوة