تبلیغات
Par30net | پارســـی نت
ورود کاربران
نام کاربری :
کلمه عبور :
کلمه عبور خود را فراموش کرده ام ؟
منوی کاربری

Make Your HomePage    Send Email To Admin    Add to Favorites

پیغام مدیر : با عرض سلام و خسته نباشی دوستانی که مایلند با ما تبادل لینک کنند از قسمت لینک دوستان لینک خود را برای ما ارسال نمایند

با تشکر   

عضویت در سایت


تماس با ما


ارسال پیام

لینكهای ویژه
لینك دوستان
چت بامدیـــــر
جستجوگر

Google
  
            
     در كل اینترنت
     در پارســـی نت

نظر سنجی

نظر شما راجع به رنگبندی سایت چیست ؟






آمار وب
بازدید های امروز:
بازدیدهای دیروز:
بازدید این ماه :
بازدید ماه گزشته:
کل بازدید ها:
نویسندگان سایت:
كل مطالب ارسالی:
آخرین به روز رسانی:
طراح قالب

Hosted by:

IranHost

ساعــــت

نویسنده گان
  • سید حسین رفعتی(416)

  • موضوعات












    آرشیو
  • هفته چهارم فروردین 1389 ( 5 )
  • هفته چهارم دی 1388 ( 115 )
  • هفته سوم دی 1388 ( 1 )
  • هفته دوم دی 1388 ( 18 )
  • هفته اول دی 1388 ( 212 )
  • هفته چهارم آذر 1388 ( 78 )
  • همه آرشیوها
  • آخرین پستها

    اس ام اس sms ماه رمضان – سری ۳

    اس ام اس و پیامک رمضان – سری ۴

    اس ام اس عید فطر

    اس ام اس عید غدیر خم – سری ۳

    اس ام اس ولادت حضرت محمد و امام صادق

    مقدمه آموزش CSS

    اصول نوشتن کد های CSS

    استفاده از شناسه Style

    CSS در HEAD صفحه

    فایل CSS خارج از صفحه

    تنظیم طول و عرض عناصر

    ایجاد کادر برای عناصر

    حاشیه و تو رفتگی عناصر صفحه

    تعیین موقعیت عناصر صفحه

    کار با متنها ( بخش اول )

    کار با متنها (بخش دوم )

    تنظیم فونت با CSS

    تنظیم رنگ متن با CSS

    تنظیم رنگ و تصویر زمینه

    تنظیم تکرار تصویر زمینه

  • همه پستها
  • لوگو دوستان


    وضعیت


    »آدرس آی پی شما:

      AddThis Feed Button



    تبلیغات
    امروز :



     آخرین اخبار سایت

    چت روم پارسِِــــی نت را اندازی شد (جدید)

    شما دوستان عزیز می توانید با عضویت در سایت و ورود به حساب کاربری خود از چت روم سایت پارســــی نت بهرمند شوید         ( تاریخ ارسال : 25/10/1388 )











    توجه:برای تبادل بنر اول بنر وب من را در وبلاگ یا سایت خود قرار دهید بعد بنر خود را برای ما بفرستید.

    برای ارسال بنر خود اینجا كلیك كنید

    تنظیم ظاهر لینک ها در صفحه

    پست: 406  |  موضوع مرتبط: آموزشی > CSS

    آموزش CSS

    اعمال تغییر بر روی لینکها در صفحه با استفاده از استایل

    با استفاده از CSS می توانیم نحوه نمایش دادن لینکها را در صفحه تنظیم کنیم. به صورتی که استفاده از جاوا اسکرپت در صفحه تا حد زیادی کم می شود. از طریق استفاده از استایل می توانیم رنگ لینکها، اندازه فونت آنها، زیر خط لینکها، رنگ زمینه هر لینک و بسیاری دیگر از خواص لینکها را تغییر دهیم.

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

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

    • a:link و a
      این مشخصه ها نحوه نمایش لینکهایی را که در صفحه وجود دارند و هنوز روی آنها کلیک نشده است تنظیم می کنند.
    • a:hover
      این مشخصه وضعیت لینک را وقتی که نشانگر ماوس روی آن قرار دارن تنظیم می کند.
    • a:active
      این قسمت مشخص کننده وضعیت لینکی است که بر روی آن کلیک می شود.
    • a:visited
      این مشخصه برای لینکهایی که در بازدیدهای قبلی مورد استفاده قرار گرفته اند استفاده می شود.

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

    <style type="text/css">
    <!--
    a:link { مشخصات مورد نظر }
    a:hover { مشخصات مورد نظر }
    a:active { مشخصات مورد نظر }
    a:visited { مشخصات مورد نظر }
    -->
    </style>

    برای هر ویژگی بالا می توانید مشخصات خاص خود را تعریف کنید برای مثال می تواند رنگ از مشخصه bachkground-color برای تعیین رنگ زمینه لینک وقتی که ماوس روی ان قرار می گیرد استفاده کنید یا از color برای تعیین رنگ متن لینکها. به طور کلی می توانید از بیشتر مشخصه هایی که برای متن ها کارایی دارند در مورد لینکها هم استفاده کنید برای مثال font-family و font-size و border و ...

    در اینجا یک مثال مطرح می کنیم که در آن لینکهای صفحه به رنگ سبز نمایش داده می شوند با اندازه فونت 12pt و بدون زیرخط، وقتی که ماوس روی آنها قرار می گیرد رنگ آنها قرمز می شود و رنگ زمینه متفاوتی پیدا می کنند همچنین یک کادر نیز اطراف آنها به وجود می آید. در موقع کلیک کردن رنگ لینک سفید می شود و لینکهایی که در دفعات قبلی کلیک شده اند با زیر خط نمایش داده می شوند. برای ساختن لینکهایی با مشخصاتی که بیان شد می توانیم از کد زیر در قسمت HEAD متن یا استایل خارجی استفاده کنیم:

    <style type="text/css">
    <!--
    a:link { color:green; font-size:12pt; text-decoration:none }
    a:hover { color:red; background-color:#6699CC; border:#006699 2px solid }
    a:active { color: white }
    a:visited { text-decoration: underline }
    -->
    </style>

    در قسمت زیر می توانید لینکهایی را که برای آنها از کد بالا استفاده شده است مشاهده کنید:

    این لینکها با استفاده از کد بالا تنظیم شده اند.

    ماوس خود را روی آنها قرار دهید.

    می توانید بر روی آنها کلیک کنید.

    همانطور که می بینید کدهایی که در قسمت HEAD این صفحه قرار دارند بر روی لینکهای بالا تأثیر گذاشته اند اما لینکها در سایر نقاط صفحه ویژگیهای متفاوتی دارند. دلیل این تفاوت این است که ما لینکهای بالا را در یک DIV قرار دادیم و برای آن یک ID در بخش HEAD صفحه تعریف کردیم و ویژگیهای مربوط به لینکهای بالا در قالب ID مشخص کردیم. در اینجا می توانید کدی را که ما مورد استفاده قرار داده ایم ببینید:

    #pre a:link,#pre a { color:green; font-size:10pt; text-decoration:none }
    #pre a:hover { color:red; background-color:#6699CC; border:#006699 2px solid; text-decoration:none }
    #pre a:active { color: White }
    #pre a:visited { text-decoration: underline; color:#003399 }

    کد مربوط به DIV را نیز به صورت زیر نوشتیم:

    <div align="center" id="pre">
    کدهای مربوط به لینکها
    </div>



    نوشته: سید حسین رفعتی ساعت: 03:12 ب.ظ تاریخ: یکشنبه 27 دی 1388 |+|
    f