مرجع مقالات رسمی طراحی سایت

 

بعداز یادگرفتن در ارتباط روش اکران راهبرد متن و نوشته که در نشست قبل مشاهده کردیم می‌خواهیم  طراحی سایت در مشهد  درین گرد‌همایی به یکی‌از خواص های اساسی در لهجه CSS یعنی خواص background اشاره کنیم.

 

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

 

درین گرد هم آیی آموزشی میخواهیم شمارا با این خواص آشنا کنیم و دستورها آن را مرور کنیم، در پایان هم نمونه کاربردی از طرز ی به کارگیری از خواص background را برای شما می‌آوریم که امید‌واریم برای شما موءثر باشد. پس با کدنویسی به گویش بی آلایش یاور باشید.

 

محرمانه فراگیری های سی اس اس (CSS)

گردهمایی اولیه : شناخت با CSS و کاربرد آن در ساخت وب سایت

 

گردهمایی دوم : شناخت با چگونگی به کار گیری از CSS در صفحه ها اینترنت

 

گردهمایی سوم : آموزش ساختار نحوی دستورها CSS در کدنویسی صفحه ها اینترنت

 

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

 

گرد هم آیی پنجم : معرفی ترفندهای کد CSS اساسی و کاربردی در طراحی وب

 

گردهمایی ششم : دستور کار متن و نوشته ها در گویش CSS هم پا با نمونه

 

 

سفارش ما به شما!

 دانلود پلاگین اضافه کردن استایل فردی به مطالب وردپرس

دور‌نما شیت با خواص background

تمجید : از خواص دور نما ( background ) در CSS برای انتخاب یک رنگ یا این که تصویر تحت عنوان دورنما یک عنصر مثل جدول یا این که ورقه به کار گیری می‌گردد.

 

خواص background

خواص یک سری کمی برای اخذ همگی خصوصیت های دورنما عنصر میباشد که هرمورد از مشخصات بایستی به ترتیب تحت در خواص background وارد گردد :

 

background : [ backgronud-color ] [ background-image ] [ background-repeat ] [ background-attachement ] [background-position ]

 

اعتنا : هر مورد از خاصیت فوق را می شود به شکل تکی نیز، تعریف‌و‌تمجید و مقدار دهی کرد. به نمونه های زیر برگه توجه فرمایید.

 

در جدول تحت هر کدام از خصوصیت های فوق را ارزیابی میکنیم :

 

خواص background

 

اسم خواص

 

نوع خواص

شرح

 

background-color

 

اسم رنگ

 

rgb (r,g,b)

 

عدد هگزادسیمال

 

گزینش کننده یک رنگ تحت عنوان دورنما عنصر میباشد . رنگ می‌تواند به نحوه های تحت رقم بخورد :

 

اسم رنگ مثل blue یا این که red

 

انتخاب رنگ توسط تابع rgb به طور پایین :

 

( مقدار رنگ قرمز رنگ ، مقدار رنگ سبز ، مقدار رنگ آبی رنگ ) rgb

 

این تابع مقدار 3 رنگ را با هم ادغام کرده و یک رنگ را ساخت و ساز می نماید. که مقدار رنگ بوسیله عددی در بین 0 تا 255 انتخاب می گردد ، که هر چه عدد بزرگتر باشد معیار آن رنگ کلاً رنگ بیشتر خواهد بود.

 

Example : rgb (10,65,232)

 

نعیین رنگ به طور عددی ترکیبی در مبنای 16 هگزادسیمال :

 

واحد سنجش رنگ آبی‌رنگ واحد سنجش رنگ سبز واحد سنجش رنگ قرمز رنگ #

 

Example : #08FF00

 

background-image

 

URL

مسیر پوشه

 

مسیر بی نقص یک عکس را که قرار میباشد تحت عنوان دور نما عنصر مصرف شود ، را انتخاب می نماید .

 

background-repeat

 

repeat

repeat-x

repeat-y

no-repeat

 

در‌حالتی که عکس انتخابی تحت عنوان دور نما یک عنصر از اندازه آن عنصر کوچکتر باشد ، گزینش می نماید که آیا با تکرار عکس در سطح بگراند عنصر ، تمام آنرا بپوشاند یا این که نه. که وضعیت های تکرار به طور تحت می‌تواند باشد :

 

– repeat : عکس در سمت و سوی افقی و عمودی تکرار شود.

 

– repeat-x : عکس تنها در سمت محورها x ها یعنی افقی تکرار گردد.

 

– repaet-y : عکس صرفا در سمت محور y ها یعنی عمودی تکرار گردد.

 

– no-repaet : عکس در هیچ جهتی تکرار نخواهد شد ، که تعیین پیش فرض میباشد.

 

background-attachement

 

scroll

fixed

 

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

 

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

 

که 2 موقعیت تحت را قادر است داشته باشد :

 

– scroll : عکس با تکان عنصر تکان می نماید.

 

– fixed : عکس اثبات بوده و با جنبش عنصر جنبش نمی نماید.

 

background-position

 

top

bottom

center

left

right

 

جای استارت قرارگیری عکس را در دورنما عنصر گزینش می نماید. این شرایط معمولا در هنگام کوچکتر بودن عکس از بگراند عنصر کاربرد دارااست و قادر است یک کدام از شرایط های ذیل باشد :

 

– top : بالای عنصر.

 

– bottom : زیر عنصر.

 

– center : در راءس عنصر.

 

– left : در سوی چپ عنصر.

 

– right : در جهت راست عنصر.

 

نمونه 1 : در جدول ذیل تعدادی شرایط خصوصیت از خواص background را در عنصر table و td مشاهده خواهید کرد :

 

 

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

< table style=\"background-color: #10AA32\" >

 

  < tr >

    < td >

       این منزل جدول دارنده رنگ دورنما جدول میباشد

    < /td >

  < /tr >

 

  < tr >

    < td style=\"background-color: Blue\" >

       این منزل دارنده یک دورنما با رنگ اختصاصی به خویش میباشد

       که به وسیله خواص استایل آن رقم خورده میباشد

    < /td >

  < /tr >

 

< /table >

نمونه 2 : در‌این نمونه یک تصویر که از فضای یک سلول جدول کوچکتر میباشد، تحت عنوان دور نما قرار داده شد‌ه‌است.

 

 

1

2

3

4

5

6

7

8

9

< table style= \"background-image:url(../pic/youcode.jpg); background-repeat:repeat; background-attachment:fixed; background-position:top; width:100%; height:200px\">

 

  < tr >

    < td >

      این جدول دارنده دور‌نما تصویری میباشد

    < /td >

  < /tr >

 

< /table >

نکته حائض اهمیت : در نمونه دوم هریک از خصوصیت های background را به طور تکی مقدار دهی کرده ایم. تک تک آن مشخصات را می شود به شکل پایین در خواص یک سری کمی background نیز انتخاب کنیم :

 

 

1

< table style=\"background:url(../pic/youcode.jpg) repeat fixed top\" >

نمونه 3 : همینطور می شود به یک متن نیز رنگ دور نما بخشید ، به نمونه پایین اعتنا فرمایید :

 

1

2

3

 

   This paragraph has a background color.

 

خب در انتهای این گرد هم آیی از محرمانه آموزشی لهجه CSS با خواص background آشنا شدید. در‌پی به خواص های دیگری از این لهجه دوست داستنی استایل دهی به صفحه های اینترنت خوا هیم اعلام کرد.