رفتن به مطلب
انجمن پی سی دی
mhossein

منبع کد های css

پست های پیشنهاد شده

با سلام! اینو تو یه انجمن دیدم و اینجا برای علاقه مندان می زارم چون منبع خیلی خوبیه!

 

خواص CSS ها

 

ما در این بخش می آموزیم که خواص مربوط به CSS ها کدامند و چگونه مقدار می گیرند . خواص CSS ها را می توان به دسته های زیر تقسیم کرد :

 

1.خواص ??ونت ها

 

2.خواص رنگ و زمینه

 

3.خواص متن

 

4.خواص کادربندی ، این خواص شامل موارد زیر است :

- خواص مربوط به حاشیه گذاری

- خواص دسته بندی

 

5.خواص مربوط به ??اصله گذاری

- خواص دسته بند ی

- خواص لیست ها

 

در زیر به شرح این خواص میپردازیم

 

=========================

=========================

=========================

 

 

1.خواص ??ونت ها

 

خواص مربوط به ??ونت ها برای تعیین خانواده ??ونت ، سبک اندازه و شکل ??ونت مورد است??اده قرار می گیرند . علاوه براین ، می توانید قواعد مربوط به رنگ ، زمینه ، حاشیه بندی و ??اصله گذاری را ترکیب کنید تا اثر متنی زیبایی را در ص??حه ایجاد کنید .

 

 

خاصیت font-family این خاصیت برای تعیین خانواده ??ونت به کار می رود . مقدار آن می تواند یک ??ونت خاص مثل Arial یا خانواده کلی مثل scan serif باشد . بر اساس استاندارد CSS1 ، خانواده های کلی زیر باید در مرورگرهایی که از CSS1 پشتیبانی می کنند وجود داشته باشد :

 

Serif ( مثل times ) .

Scan-serif ( مثل helvetica ) .

Cursive ( مثل zaff-chancery ) .

fantasy ( مثل western ) .

moonscape ( مثل courier ) .

 

همانند دستور < font > ، وقتی از چند خانواده ??ونت است??اده می کنید ، باید آن ها را به ترتیب اولویت بنویسید و آن ها را با کاما از هم جدا کنید . است??اده از چند خانواده ??ونت به این دلیل صورت می گیرد که بر روی کامپیوتری یک خانواده ??ونت موجود نبود ، از خانواده دیگری است??اده شود . دستور {font – family : arial , scans - serif } موجب می شود تا از خانواده ??ونت Arial است??اده گردد و در صورت عدم وجود این خانواده در یک کامپیوتر ، از خانواده scan-serif است??اده می شود .

 

----------------------------

 

خاصیت font size با است??اده از این خاصیت می توان اندازه نسبی یا واقعی ??ونت را تعیین کرد . اندازه ??ونت را با است??اده از کلمات x-large , large , medium , small , x-small , xx-small و xx-large یا کلمات نسبی مثل larger و smaller تعیین کرد . علاوه بر این ، اندازه ??ونت بر حسب 5 واحد قابل بیان است : تعداد نقاط ( مثل font-size:12pt ) ، تعداد پیکسل ها ( مثل font-size :30px ) ، اینچ ( مثل font-size:2inch ) ، سانتیمتر مثل ( font-size:2cm ) و درصد ( مثل font-size:200% ) . وقتی اندازه ??ونت برحسب درصد بیان می شود ، نسبت به اندازه پیش ??رض آن سنجیده خواهد شد . دستورات زیر را ببندید :

 

{ font – size : 18pt }

{font – size : larger }

{ font – size : 200% }

----------------------------

 

خاصیت font-style این خاصیت برای تعیین سبک ??ونت به کار می رود که می تواند مقادیر normal ، italic یا oblique را بپذیرد . سبک مشابه سبک italic است ولی مرورگر خودش سعی کند میزان اریب بودن متن را تعیین کند :

 

{ font – style : oblique }

{ font – style : normal }

----------------------------

 

خاصیت font-weight این خاصیت ، وزن ??ونت یا میزان تاریکی آن را تعیین می کند . مقادیر این خاصیت از 100 تا 900 با ا??زایش 100 است . از کلمات کلیدی نیز می توان است??اده کرد : bolder , bold و lighter . بعضی از مرورگرها از کلمات کلیدی bold , demi-bold , medium , demi-light , light , extra-light و extera-bold نیز است??اده می کنند . چون خاصیت خانواده ??ونت نیز می تواند مقدار bold را بپذیرد ، برای جلوگیری از اشتباره بهتر است از مقادیر عددی است??اده شود :

 

{ font – wight : bolder }

{ font – weight : 900 }

 

----------------------------

 

خاصیت font-variant این خاصیت ، شکل خاصی از ??ونت تعیین شده یا ??ونت پیش ??رض را انتخاب می کند . دو شکلی که ??علاً پشتیبانی می شود عبارتند از : small-caps و normal . مقدار small-capsحرو?? بزرگ را به شکل کوچکی نمایش می دهد و normal کار خاصی انجام نمیدهد :

 

{ font-variant : small-caps }

 

----------------------------

 

خاصیت ??ونت این خاصیت ، یک روش دقیق برای تعیین تمام خواص ??ونت با یک خاصیت style است . یکی از ص??ات خاصیت font برابر با line-height است که ??اصله بین دو سط از متن را مشخص می کند . ص??ات ??ونت می توانند با ??اصله از هم جدا شوند . به جز line-height که با font-size به کار می رود و با اسلش (/) از آن جدا می گردد . شکل کلی قاعده ??ونت به صورت زیر است :

 

font: font-style font-variant font-weigh font-size / line-hight font-family

 

نمونه ای از کاربرد خاصیت ??ونت به صورت زیر است :

 

{ font : italic small-caps 600 18pt / 24 " arial , Helvetica" }

 

 

=========================

=========================

=========================

 

 

خواص رنگ و زمینه

 

خواص رنگ و زمینه خواص گوناگونی برای کنترل رنگ ها و زمینه ها در یک سند HTML وجود دارد . با است??اده از CSS ها می توان ناحیه های مختل??ی با رنگ زمینه و تصاویر ایجاد کنید . سی اس اس CSS1سه شکل مشخصات رنگ را پشتیباین می کند .

 

نام رنگ کلمات کلیدی مربوط به رنگ ها عبارتند از aqua ، black ، blue ، fushia ، gray ، green ، lime ، marron ، navy ، olive ، purple ، red ، sliver ، teal ، white و yellow .

 

مقادیر مبنای 16 از 6 رقم به شکل #0000ff رنگ آبی و #fffff رنگ س??ید را مشخص می کند .

 

مقادیر rgb ??رمت rgb به صورت ( r, g ,b ) rgb نمایش داده می شود که r ، g و b در بازه ص??ر تا 255 هستند . اغلب مرورگرها از این ??رمت رنگ پشتیبانی نمی کنند .

 

 

----------------------------

 

خاصیت color این خاصیت برای تعیین رنگ متن مورد است??اده قرار می گیرد . مثال های زیر را ببینید :

 

{color : green }

{color : #ff0088}

{color : #0f0}

----------------------------

 

خاصیت background-color این خاصیت ، رنگ زمینه یک دستور را مشخص می کند . مقدار ??رضی آن none است و هر محتویاتی بر روی آن قابل نمایش است . این وضعیت با کلمه کلیدی transparent نیز مشخص می شود . این خاصیت همراه با خاصیت color قابل است??اده است .

 

----------------------------

 

خاصیت background-image این خاصیت ، تصویری را به عنوان زمینه یک دستور انتخاب می کند . در این خاصیت باید url ??ایل تصویر را ذکر کرد .

 

{ background – image : url ( arm.gif) ; background – color : white }

----------------------------

 

خاصیت background – repeat در حالی که تصویر کوچکتر از ??ضایی است که در اختیار آن دستور قرار گر??ته است ، این خاصیت تعیین می کند تصویر چگونه در آن ??ضا قرار گیرد . مقدار repeat-x موجب می شود در بعد ا??قی قرار گیرد و مقدار repeat-y موجب می شود تصویر در امتداد ب??عد عمودی قرار گیرد . مقدار no-repeat موجب می شود تا تصویر در زمینه قرار نگیرد . دستور زیر را ببینید :

 

{background-image : url ( arm.gif ) ; background-repeat : repeat-x }

----------------------------

 

خاصیت background-attachment این خاصیت تعیین می کند که آیا تصویر زمینه ، همراه جابجای متن ، جابجا شود یا خیر . مقدار ??رضی این خاصیت scroll است .مقدار fixed آن را ثابت مگه می دارد :

 

{ background-image : url ( arm.gif ) ; background-attchment : fixed }

----------------------------

 

خاصیت background-position این خاصیت تعیین می کند که چگونه یک تصویر زمینه در ??ضایی که برای آن منظور شد قرار گیرد . سه روش برای تعیین موققعیت تصویر وجود دارد :

 

- گوشه بالا و سمت چپ تصویر می تواند به عنوان یک ??اصله مطلق منظور شود .

 

- موقعیت تصور می تواند یه صورت درصد ( ا??قی یا عمودی ) ذکر شود .

 

- است??اده از کلمات کلیدی برای تعیین موقعیت تصویر ، کلمات کلیدی برای بعد ا??قی عبارتند از : left ، center و right . کلمات کلیدی در راستای عمودی عبارتند از top ، center و bottom . وقتی از کلمات کلیدی است??اده می شود ، بعدی که تعیین نشده باشد ، center منظور خواهد شد . دستورات زیر را ببینید :

 

{background-image : url ( arm.gif ) ; background-position : 10 px10 px }

{ background-image : url ( arm.gif ) ; background-position : 20% 40%}

----------------------------

 

خاصیت background با این خاصیت می توان تمام خواص عناصر زمینه را تعیین کرد . ترتیب خواص ، مهم نیست . هر خاصیتی که تعیین نشده باشد ، پیش ??رض آن منظور خواهد شد :

 

{ background : while url ( arm.gif ) repeat-y center }

 

 

=========================

=========================

=========================

 

3.خواص متنی

 

خواص متنی موجب می شوند تا متن های موجود در یک بلوک مثل پاراگرا?? تنظیم و ص??حه آرایی کرد . هنگامی که متن یا سایر اشیا را به وسیله CSSدستکاری می کنید ، باید یک طول یا اندازه را مشخص کنید . بعضی از این واحدها در مورد ??ونت بیان شد ( نقطه ، سانتیمتر ، اینچ و غیره ) .

 

----------------------------

 

خاصیت word-spacing این خاصیت ، ??اصله بین کلمات را تعیین می کند . مقدار normal از حالت پیش ??رض مرورگر است??اده می کند . ??اصله بین کلمات می توان با اینچ ( in ) ، ساتیمتر (cm) ، میلی متر (mm) ، نقاط (pt) ، پیکاس (pc) ، میزان (em) وپیکسل (px) تعیین کرد . بسیاری از مرورگرها از این خاصیت پشتیانی نمی کنند . دستورات زیر ببینید :

 

{ word-spacing : 1cm}

{ word-spacing : 10 pt}

 

----------------------------

 

خاصیت letter-spacing این خاصیت میزان ??اصله بین حرو?? را تعیین می کند . مقدار normal این ??اصله را به عهده مرور گر می گذارد . ??اصله می توان بر حسب اینچ (in) ، سانتیمتر (cm) و سایر مواردی که در word-spacing گ??ته شد تعیین کرد :

 

{ letter-spacing : 0.2 em }

{ letter-spacing : 2 px}

 

----------------------------

 

خاصیت vertical-align این خاصیت موقعیت عمودی متن و تصویر را نسبت به خط پایه مشخص می کند . مقادیری را که این خاصیت می تواند بپذیرد عبارتند از baseline ، sub ، super ، text-top ، middle ، bottom ، text-battom و مقادیر درصد . این مقادیر را می توانید با ص??ت align مربوط به دستور مقایسه کنید .مقدار پیش ??رض این خاصیت ، baseline است . دستورات زیر را ببینید :

 

{ vertical-align : text-top }

{ vertical-align : sub ; font-size : 75% }

 

----------------------------

 

 

خاصیت text-align این خاصیت ،متن موجود در دستورات بلوکی مثل< p> و p > را تنظیم میکند . مقادیر این خاصیت عبارتند از : left ، right ، center و justify . دستورات زیر را ببینید :

 

{text – align : justify}

{text – align : center}

----------------------------

 

خاصیتtext – indent این خاصیت ، تو ر??تگی اولین خط از متن را در دستورات بلوکی مثل < p > تعیین می کند . ان بر حسب cm ، px ، pt و غیره اند :

 

{tex – indent : 2em}

{text – indent : 50px}

این خاصیت می تواند مقادیر من??ی را بپذیرد که منجر به بیرون ر??تگی متن می شود :

 

{text – indent : -10px ; background : yellow}

 

----------------------------

 

 

خاصیت line – heighgt این خاصیت ??اصله بین خطوط متن را در دستورات بلوکی مثل < p > تعیین می کند . مقادیر این ص??ت می تواند به صورت تعداد خطوط (4 . 1) ، طول (14 pt) یا در صدی از ارت??اع خط بیان شود (مثل 200%) . بنابراین ، برای اینکه ??اصله خطوط دو برابر شود از دستورات زیر است??اده می گردد :

 

{line – height : 2}

{line – height : 200%}

----------------------------

 

خاصیت text – decoration این خاصیت جلوه ای را بر روی متن ایجاد می کند . مقدار blink متن را چشمک زن می کند ، lin – through خطی را بر روی متن رسم می کند ، overline خط را بر بالای متن و underline خطی را در زیر متن رسم می کند و none جلوه ای ندارد . معمولا این خاصیت با دستور < a > به کار می رود تا وضعیت پیوند را مشخص کند :

 

{text – decoration : line through}

{text – decoration : blink}

----------------------------

 

خاصیت text – transform این خاصیت حرو?? متن را به حرو?? کوچک یا بزرگ تبدیل می کند . مقادیر این خاصیت عبارتند از capitaliz ، uppercase ، lowercase و none . توجه کنید که مقدار capitalize ممکن است تمام کلمات را به حرو?? بزرگ تبدیل نماید . دستورات زیر را ببینید :

 

{text – transform : capitalize}

{text – transform : uppercase}

=========================

=========================

=========================

 

4.خواص کادرها

 

می توان این طور تصور کرد که دستورات بلوکی مثل < p > یک کادر مستطیلی را در ص??حه نمایش اشغال می کنند . سه جنبه از این کادرها را می توان به وسیله خواص CSS کنترل کرد که عبارتند از : خواص حاشیه گذاری ، خواص مرکز کادری که متن را در بر می گیرد و خواص ارت??اع ، پهنا و موقعیت .

 

----------------------------

 

 

خواص حاشیه گذاری

 

در طراحی ص??حات باید دقت داشته باشید که عناصر و متن های ص??حه باید طوری تنظیم شوند که چشم خواننده از عنصری به عنصر دیگر هدایت شود . بخش های خالی ص??حه باید طوری باشد که چشم بیننده خسته نشود . بنابراین ، حاشیه گذاری می تواند در زیبایی ص??حه موثر باشد . اندازه حاشیه را می توان بر حسب نقطه یا اینچ ، سانتیمتر و پیکسل تعیین کرد .

 

خاصیت margin – top این خاصیت حاشیه بالای ص??حه وب را تعیین می کند :

 

{mergin – top : 20 px}

خاصیت mergin – right این خاصیت حاشیه سمت راست متن را تعیین می کند :

 

{mergin – right : 10 px}

خاصیت mergin – bottom این خاصیت حاشیه پایین ص??حه وب را تعیین می کند :

 

{mergin – bottom : 2 in}

خاصیت mergin – left این خاصیت حاشیه سمت چپ ص??حه وب را تعیین می کند :

 

{mergin – left : 2 in}

خاصیت margin این خاصیت می تواند هر چهار حاشیه (بالا ، راست ، پایین و چپ) را تعیین کند . دستور زیر را ببینید :

 

{margin : 1 . 5 cm}

{Mergin : 10 px , 5 px , 15 px , 5 px}

دستور اول حاشیه بالا ، راست ، پایین و چپ را 5/1 سانتیمتر تعیین می کند ولی دستور دوم ، حاشیه بالا را 10 px ، حاشیه راست را 5 px ، حاشیه پایین را 15 px و حاشیه چپ را 5 px تعیین می کند . دقت کنید که حرکت در جهت عقربه ساعت است . اولین مقدار مربوط به حاشیه بالا ، دومین مقدار مربوط به حاشیه راست ، سومین مقدار مربوط به حاشیه پایین و چهارمین مقدار مربوط به حاشیه چپ است . هر کدام که تعیین نشود ، برابر با حاشیه مقابل ان منظور خواهد شد . به عنوان مثال ، اگر حاشیه بالا تعیین شود ولی حاشیه پایین نعیین نشود ، حاشیه پایین به اندازه حاشیه بالا منظور خواهد شد .

 

----------------------------

 

خواص مرز کادرها

 

با است??اده از این خواص می توان لبه های دستورات بلوکی را کنترل کرد ، به طوری که مرزی برای ان ها تعیین نمود و پهنا و رنگ مرزها را مشخص کرد .

 

----------------------------

 

خاصیت border – style این خاصیت ، سبک ظاهری مرزها را تعیین می کند . مقدار پیش ??رض ان none است و معنایش این است که مرزی رسم نشود .

 

خاصیت border-style مرزهای هر چهار طر?? کادر را تعیین می کند . برای تعیین هر چهار طر?? کادر به طور جداگانه ، می توان از سبک های border-top-style ( برای بالا ) ، border- bottom- style ( برای پایین ) ، border-left-style ( برای سمت چپ ) و border-right-style ( برای سمت راست ) است??اده کرد .

 

در خاصیت border- style می توان نوع مرز هر چهار طر?? را تعیین کرد . اولین مقدار مربوط به سمت بالا ، دومین مقدار مربوط به سمت راست ، سومین مقدار رمبوط به پایین و چهار مین مقدار مربوط به سمت چپ است . وقتی مقادیری که ذکر می شوند کمتر از 4 باشند ، مرز مقابل ، به طور خودکار مقدار می گیرد . به عنوان مثال ، اگر سبک مرز بالایی تعیین شود ولی سبک مرز پایینی تعیین نشود ، سبک مرز پایینی مثل سبک مرز بالایی منظور خواهد شد . هر کدام از دستورات زیر ، مرز های دو خطی را در بالا و پایین کادر منظور می کنند :

 

{border- style: double none}

{border- style: double none double none }

border –bottom – style : double ; border - left ; {border- style: double

style : none; border –right-style:none;}

 

----------------------------

 

خاصیت border – width خواص گوناگونی برای تعیین پهنای مرزها به کار می روند . ص??ت border - width پهنای هر چهار طر?? کادر را مشخص می کند و ر??تار ان مثل border- style است . برای تعیین هر کدام از چهار طر?? کادر به طور جداگانه ، از خواص border – top - width ( برای پهنای بالا ) ، border – right- width ( برای پهنای سمت راست ) border – bottom-width ( برای پهنای پایین ) و border – left – width ( برای پهنای سمت چپ ) است??اده می شود.

 

پهنای مرزها را با کلمات کلیدی thick , medium, thin یا با است??اده از مقادیری مثل 5 , 10 و غیره تعیین کرد . دستورات زیر را ببینید :

 

{border- style: Solid ; border – width; 10 px}

{border- style:double ;border – width : thick}

{border- style:solid;border – width : thick thin}

{border- style:double;border – width : thick}

----------------------------

 

خاصیت border-color این خاصیت رنگ مرزها را تعیین می کند. رنگ ها را می توان با نام یا اعداد مبنای 16 بیان کرد . این خاصیت ، رنگ هر چهار طر?? کادر را تعیین می کند و از یک تا چهار مقدار را می پذیرد .

مقادیر ذکر شده ، در جهت چرخش عقربه های ساعت ( رنگ بالا ، پایین و سمت چپ ) اعمال می شوند . برای تعیین رنگ هر مرز به طور جداگانه ، از خواص border- right – color, border, border – top- color border – left- color , border – bottom –color است??اده می شود . دستورا زیر را ببینید :

 

{border – style: soild; border-color: green}

border- style : solid ; border- top – color ; green ; border –right – color:}

ff0000; border – bottom –color : yellow ; border –left –color :blue}

----------------------------

 

 

خواص ??اصله گذاری

??اصله بین کادر یک دستور و محتویات آن با است??اده از خواص ??اصله گذاری تعیین می شود. این خواص عبارتند از : padding- left, padding – bottom, padding- right , padding – top به جای همه این ها می توان از خاصیت padding است??اده کرد که ??اصله هر چهار طر?? را تعیین می کند. این خاصیت از یک تا چهار مقدار می پذیرد که با شروع از بالای کادر ، در جهت حرکت عقربه های ساعت مورد است??اده قرار می گیرند . هر کدام از مقادیر که ذکر نشود ، همانند طر?? مقابل خودش خواهد بود. مثلاً اگر ??اصله سمت راست تعیین شود ولی سمت چپ تعیین نشود ، ??اصله سمت مانند ??اصله سمت راست تنظیم می شود. دستورات زیر را ببینید :

 

{padding- top : 1cm}

{border – style : solid; padding – left :20mm; padding – right :50mm}

{ border- style: soild ; padding : 1 cm }

{ padding : 2mm 4mm

 

دستور سوم یک خط ضخیم دور کادر رسم می کند و ??اصله هر طر?? با محتویات ان یک سانتیمتر است . دستور چهارم ??اصله از بالا و پایین را 2 میلیمتر و ??اصله از سمت راست و چپ را 4 میلیمتر در نظر می گیرد .

 

----------------------------

 

خواص width و height خاصیت width پهنای ناحیه محتویات دستورات را تعیین می کند و خاصیت height ارت??اع ناحیه محتویات دستورات را مشخص می کند . دستورات زیر را ببینید :

 

 

{ width : 300px ; padding : 10px ; background : yellow ; color : black }

{ height : 10cm ; width 10% }

{height : 100px ; width : 300px }

 

----------------------------

 

خواص float و clear تنظیم ا??قی دستورات را تحت تأثیر قرار می دهد و موجب می شود به سمت چپ یا راست ناحیه دستور حرکت کنند . این خاصیت برای درج اشیایی مثل تصویر در ص??حه وب م??ید است . مقادیر flot عبارتند از left ، right و non مقدار پیش ??رض است . دستور زیر را ببینید :

 

{ ma { float : right }

 

اما وقتی محل تصویر یا هر شی ء دیگری که توسط float تعیین شد ، متن های آن عنصر چگونه تنظیم می شوند ؟ این کار توسط خاتصیت clear انجام می گیرد . مقدار left , سمت چپ اشیاء مقدارright سمت راست اشیا و مقدار both هر طرحی را بزرگ تر بود پاک می کند . مقدار پیش ??رض آن none است.

 

{ width : 150 ; height : 150 ; float : right }

{ clear : both }

 

 

=========================

=========================

=========================

 

5.خواص دسته بندی

 

CSS های آبشاری شامل چندین خواص دسته بندی نمایش یک دستور را مشخص میکند بعضی از این خواص در زیر بررسی می شوند :

 

----------------------------

 

خاصیت disply مدل CSS سه نوع عناصر نمایشی را تشخیص می دهد : عناصر بلوکی ، عناصر دستوری و لیست ها . خاصیت disply موجب می شود تا نوع نمایش یک عنصر به یکی از این 4 مقدار تغییر کند : block (بلوکی) ، inline(دستوری)، list – item(لیست) و none . مقدار none موجب می شود که عنصر نمایش داده نشود و یائ از ??ضا است??اده نکند . دستورات زیر را ببینید :

 

{display : none}

{display : inline}

----------------------------

 

 

خاصیت white – space این خاصیت تعیین می کند که کارکترهای ??ضای خالی ، tab و خط جدید چگونه در یک دستور ظاهر شوند . مقدار پیش ??رض ان normal است که همة کارکترهای ??ضای خالی به یک ??ضای خالی تبدیل می شوند و خطوط به طور خودکار شکسته می شوند . مقدار pre برای این خاصیت مشخص می کند که تمام کارکترهای ??ضای خالی منظور شوند (مثل دستور

 در HTML) . مقدار nowrapموجب می شود تا در صورتی که طول خطوط از پهنای محتویات بیشتر شد ، شکسته نشود . دستور زیر را ببینید :

 

{white – space : pre}

توجه کنید که مقادیر pre و nowrap از خاصیت white – space ، در بسیاری از مرورگرها پشتیبانی نمی شوند .

 

 

=========================

=========================

=========================

 

6.خواص لیست ها

 

HTML از سه نوع لیست پشتیبانی می کند :لیست های مرتب- لیست های نا مرتب و لیست های تعری??ی . CSS های ابشاری ، امکاناتی را برای دستکاری لیست ها ??راهم می کنند . یعنی خواصی وجود دارند که در مورد لیست ها به کار می روند : type – style – list ، image – style – list و position – style – list . خاصیت کلی style – list به جای هر سه خاصیت دیگر قابل است??اده است .

 

 

 

----------------------------

 

خاصیت type – style – list بر اساس نوع لیست ، عناصر لیست با شماره یا شکل های خاصی مثل دایره تو پر ، تو خالی و غیره مشخص می شوند . شش مقدار برای لیست های مرتب مناسب اند : decimal(اعداد دهدهی) ، roman – lower(حرو?? کوچک رومی) ، roman – upper (حرو?? بزرگ رومی) ، alpha – lower(حرو?? کوچک) ، و alpha – upper(حرو?? بزرگ) . مقادیر مناسب برای لیست های نا مرتب عبارتند از disk(دایره تو پر) ، circle(دایره) ، و square(مربع) . مقدار none موجب جلوگیری از بر چسب عناصر لیست می شود . دستورات زیر را ببینید :

 

{list – style – type : upper – roman}

{list – style – type : square}

 

----------------------------

 

خاصیت image – style – list این خاصیت می تواند تصویر گرا??یکی را به عنوان بر چسب عناصر لیست انتخاب کند . مقادیر این خاصیت ، url تصویر یا none است . دستور زیر را ببینید :

 

{list – style – Image : url ("arm . gif")}

 

----------------------------

 

خاصیت position – type – list این خاصیت تعیین می کند که بر چسب عناصر لیست نسبت به کادر دستورات ، چگونه قرار گیرد . مقادیر این خاصیت عبارتند از : inside و outside . مقدار inside موجب می شود تا برد چسب در داخل کادر و مقدار outside موجب می شود تا بر چسب در خارج کادر قرار گیرد . مقدار پیش ??رض outsid است . دستور زیر را ببینید :

 

 

{list – style position : hnside}

__

به اشتراک گذاری این ارسال


لینک به ارسال
به اشتراک گذاری در سایت های دیگر

برای ارسال دیدگاه یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید دیدگاهی ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در سایت ما ثبت نام کنید. عضویت خیلی ساده است !

ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید

ورود به حساب کاربری

×
×
  • جدید...