تغییر پارامترهای نمایش پیوندها در html با استفاده از ورق های سبک css آبشار قابل انجام است. آنها به شما امکان می دهند نمایش قلم پیوند ، رنگ آن را قبل از کلیک کاربر بر روی آن و پس از کلیک ماوس ، سفارشی کنید. همچنین می توانید نوع فونت مورد استفاده و اندازه آن را تغییر دهید.
دستورالعمل ها
مرحله 1
از کلاسها و کلاسهای شبه برای تنظیم پارامترهای پیوند در css استفاده می شود. پیوند شبه کلاس a: سبک را برای یک پیوند معمولی تنظیم می کند ، a: بازدید شده به شما امکان می دهد نمایش پیوندی را که قبلاً استفاده شده است ، شخصی سازی کنید. A: فعال وقتی پارامترها را روی عنصر کلیک می کنیم پارامترهای برچسب را کنترل می کند و a: hover سبک پیوند را هنگامی که روی آن قرار می گیرید تنظیم می کند. همچنین می توانید هر کلاس برای عنصر خود ایجاد کنید و در پارامترها از عملگرهای استاندارد برای قالب بندی متن استفاده کنید.
گام 2
برای غیرفعال کردن نمایش زیر خط متن پیوند در مرورگر ، از پارامتر text-decoration: none استفاده کنید. می توانید این ویژگی را هم در یک کلاس و هم در یک کلاس شبه برای یک عنصر مشخص کنید. برای تغییر رنگ پیوند ، از پارامتر رنگ برای اندازه استفاده کنید - ویژگی استاندارد اندازه قلم. اگر می خواهید از نوع bold یا italic استفاده کنید ، از پارامتر font-weight استفاده کنید.
مرحله 3
فایل html خود را با ویرایشگر متنی که برای ویرایش کد صفحه استفاده می کنید باز کنید. پس از آن ، به بخشی از سند خود بروید و کد css را برای پیوندهای بعدی در صفحه با استفاده از دسته تنظیم کنید. مثلا:
تغییر پیوندها
a: link {text-decoration: none؛
اندازه قلم: 14px؛
font-weight: پررنگ؛
رنگ: قرمز؛ }
مرحله 4
این کد زیر خط را از یک پیوند عادی حذف می کند ، اندازه متن را روی 14 پیکسل تنظیم می کند ، یک سبک پررنگ و رنگ قرمز عنصر را اعمال می کند. اکنون هر پیوندی در برچسب به این شکل نمایش داده می شود.
مرحله 5
با استفاده از کلاس های css می توانید برای هر لینک خاص استایل دهید. بنابراین ، اگر کد موجود در برچسب به این شکل است:
a.link1 {font-size: 20px؛ رنگ سیاه؛}
مرحله 6
می توانید اندازه پیوند را روی 20 پیکسل و سیاه را با استفاده از کلاس موجود در متن سند به شرح زیر تنظیم کنید:
ارتباط دادن
از مثال می توانید ببینید که پیوند با تعیین ویژگی کلاس پیوند ، کلاس ایجاد شده کد css ایجاد شده است. این پیوند اکنون با رنگ سیاه نمایش داده می شود و اندازه آن 20 پیکسل است. برای تغییر این ویژگی ، کد css بخش صفحه را ویرایش کنید.
مرحله 7
تغییر ظاهر پیوند کامل است ، می توانید تغییرات ایجاد شده در پرونده را ذخیره کرده و برای مشاهده در مرورگر اجرا کنید.
