از ویژگی Cascading Style Sheets (CSS) معمولاً برای تغییر رنگ پیوندها در صفحات وب استفاده می شود. راه حل های کم کاربردی برای این مشکل در زبان HTML وجود دارد (HyperText Markup Language - "HyperText Markup Language").
لازم است
دانش اولیه زبانهای HTML و CSS
دستورالعمل ها
مرحله 1
یک فرم طراحی برای هایپر لینک ها آماده کنید. در ساده ترین شکل ممکن است این شکلی باشد: رنگ سبز رنگ پیوند را تعریف می کند ؛ این یک تعریف بسیار خشن از رنگ است و بندرت استفاده می شود. خیلی بیشتر اوقات ، "کلاس شبه" به انتخاب "a" اضافه می شود - این یک برچسب است که به شما اجازه می دهد سبک پیوند را در سه حالت مختلف مشخص کنید.
گام 2
از کلاس شبه پیوند برای تنظیم حالت عادی (غیرفعال) پیوند استفاده کنید. ممکن است اینگونه باشد ، به عنوان مثال: a: link {color: Green}
مرحله 3
برای مشخص کردن نحوه نمایش پیوند در شناور ، از شناور کلاس شبه استفاده کنید. به عنوان مثال: a: hover {color: Lime}
مرحله 4
برای توصیف سبک پیوندی که قبلاً بازدید کرده اید ، از کلاس شبه بازدید شده استفاده کنید. به عنوان مثال: a: بازدید شده {color: DarkGreen}
مرحله 5
هر سه حالت را در یک بلوک توصیف سبک ترکیب کنید. برای مثال ، کد HTML حاوی توصیف CSS از سبک ها می تواند به صورت زیر باشد:
a: link {color: Green}
a: بازدید شده {color: DarkGreen}
a: hover {color: Lime}
در اینجا ، باز و بسته شدن برچسب های سبک HTML به مرورگر می گوید که توصیف سبک از کجا شروع و پایان می یابد و بین آنها توصیف رفتار پیوند در سه حالت وجود دارد.
مرحله 6
نمونه مورد استفاده در بالا فقط مشخصات رنگ را نشان می دهد ، اما سایر مشخصات را می توان در توضیحات گنجانید. به عنوان مثال ، اگر طراحی صفحه مستلزم آن است که پیوند در حالت عادی (غیرفعال) زیرخط دار نباشد ، اما وقتی مکان نما روی آن قرار می گیرد ، زیر آن خط می خورد ، کد را می توان به صورت زیر اصلاح کرد:
a: link {color: Green؛ دکوراسیون متن: هیچ؛}
a: بازدید شده {color: DarkGreen؛ دکوراسیون متن: هیچ؛}
a: hover {color: Lime؛ text-decoration: underline؛}
مرحله 7
اگر می خواهید رنگ برخی از پیوندها را در صفحه تغییر دهید و بقیه را با تنظیمات پیش فرض بگذارید ، سپس ویژگی کلاس را به برچسب هر پیوند در حال تغییر اضافه کنید. به عنوان مثال ، این کلاس hyperlink را newLinks بگذارید. سپس برچسب پیوند ممکن است به این شکل باشد: text link همان نام کلاس باید به توضیحات سبک اضافه شود:
a.newLinks: link {color: Green؛ دکوراسیون متن: هیچ؛}
a.newLinks: بازدید شده {color: DarkGreen؛ دکوراسیون متن: هیچ؛}
a.newLinks: شناور {color: Lime؛ text-decoration: underline؛}
مرحله 8
کد شرح سبک تهیه شده از مثالهای توضیح داده شده در بالا را در هدر صفحه - بین برچسب ها و قرار دهید. در صورت لزوم ، یک ویژگی کلاس به برچسب های پیوند با نامی که در توضیحات سبک استفاده شده اضافه کنید. سپس صفحه اصلاح شده را ذخیره کرده و روش تغییر رنگ پیوندها به پایان می رسد.
