آموزش CSSآموزش طراحی سایت

استایل Link در CSS

با سلام به شما همراهان عزیز میزفا، در ادامه آموزش CSS به استایل دهی لینک ها در CSS میرسیم . برای یادگیری آنچه از  لینک ها در سی اس اس نمیدانید ، تا انتهای مقاله با ما همراه باشید .

استایل عناصر در CSS

سبک دهی به لینک ها

می توان لینک ها را به شیوه های مختلف سبک دهی (بندی)کرد .

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

 

a {

color: #FF0000;

}

به علاوه این امکان وجود دارد که لینک ها را بسته به state(حالتی) که در آن قرار دارند, به گونه ای متفاوت سبک دهی کرد .

 

چهار حالت مختلف برای لینک ها

  • ink – لینکی معمولی که هنوز مورد بازدید قرار نگرفته است .
  • avisited – لینکی که کاربر از آن بازدید کرده است .
  •  ahover – حالتی که در آن مکان نمای موس روی لینک قرار گرفته است .
  •  aactive – در این حالت کاربر روی لینک مورد نظر کلیک کرده

`

 

/* unvisited link */

a:link {

color: #FF0000;

}

/* visited link */

a:visited {

color: #00FF00;

}

/* mouse over link */

a:hover {

color: #FF00FF;

}

/* selected link */

a:active {

color: #0000FF;

}

 

سبک های معمول لینک

در این بخش به دیگر شیوه های معمول در سبک دهی به لینک ها خواهیم پرداخت

افزودن جلوه های بصری به لینک ها ( Text decoration )

خاصیت text-decoration غالبا به منظور حذف زیرخط ها ( underline ) از لینک ها مورد استفاده قرارمی گیرد.

a:link {

text-decoration:none;

}

a:visited {

text-decoration: none;

}

a:hover {

text-decoration: underline;

}

a:active {

text-decoration: underline;

}

 

رنگ پس زمینه( background color)

 

خاصیت background-color رنگ پس زمینه ی لینک ها را تعیین می کند.

a:link {

background-color: #B2FF99;

}

a:visited {

background-color: #FFFF85;

}

a:hover {

background-color: #FF704D;

}

a:active {

background-color: #FF704D;

}

در بخش بعدی از سری آموزش استایل css ، طبق طبقه بندی ارایه شده برای آموزش به استایل دهی لیست ها  در css میپردازیم . پس با ما همراه باشید .

 

برچسب ها

پوریا آریافر

اولین کسب و کار آنلاین خودم را در فیسبوک راه‌اندازی کردم و در سال ۲۰۱۱ یکی از پرتعامل‌ترین صفحات فارسی با ۸۰ هزار فالور فعال را داشتم. سپس وارد دنیای شبکه شدم و در انتهای سال ۲۰۱۲ مدرک MCSE مایکروسافت را دریافت کردم، در دوران خدمت سربازی مسئول بهینه سازی یک وبسایت خبری معتبر شدم و آشنایی با سئو را آموختم و در سال ۲۰۱۴ توانستم به رتبه ۴۰۰ الکسا نزدیک کنم. برخلاف میل درونی، وارد دانشگاه شدم و سه ساله در مقطع کارشناسی IT فارغ التحصیل شدم، در همان سال بزرگ‌ترین کانال تلگرامی IT با ۴۰ هزار عضو را داشتم، که فروختم تا بتوانم تمرکز را فقط بر روی سئو بگذارم، فعالیت‌های سئو به شکل تخصصی بنده در قالب پروژه‌های مختلف و آموزش‌های حضوری و غیرحضوری در دفتر میزفا و دانشگاه علامه طباطبایی تهران صورت ‌می‌گیرد، تجربه بهینه سازی موفقی در بهبود UX و CRO پروژه‌های سئو کسب کرده‌ام. در همه ابزارهای گوگل به جز adwords تسلط کاملی دارم. عاشق کسب تجربه های جدید هستم. راز پیشرفت در هر کاری را یادگیری و یاددادن می‌دانم و میزفا که در اواخر ۲۰۱۶ راه‌اندازی شده، می‌تواند چنین بستر مناسبی را فراهم کند. نقد و بازخوردهای سازنده شما، جوهر تلاش‌های مستمر ماست تا یک قدم خودمون بهبود بدیم. منتظریم ...

نوشته های مشابه

‫2 نظرها

  1. سلام کد هاتون تو این آخریه اشتباهه
    اینطوریه
    a: link
    a: visited
    دونقطه رو نذاشتین فقط …
    بازم خوب بود ممنون…….

    1. سلام. درسته. ممنونم از اینکه اعلام کردید. به زودی همه مقالات بازنگردی میشن و دوره مقاله محور css کامل میکنیم.

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا
سایت خود را در گوگل مدیریت کنید + ۱۵ ساعت فیلم آموزشیجزئیات بیشتر اینجا کلیک کنید
بستن
با موفقیت ثبت شد، میزفا از شما برای عضویت در خبرنامه هفتگی تشکر میکند.

عضویت در خبرنامه هفتگی برای دریافت:

  • فیلم و مقاله رایگان سئو
  • آموزش‌های UX ، GA و GTM
  • مقاله های تخصصی ASP.NET Core
  • اطلاع رسانی از محصولات
ترک میزفا خوب نیست!
دوره رایگان سئو