PDA

View Full Version : سوال: کمک برای نوشتن کد css



طبیب دل
دوشنبه 12 تیر 1391, 15:12 عصر
با سلام به دوستان
من چند تا لینک تو صفحه دارم حالا میخوام وقتی موس میره روی هر کدوم اینها این کارها اتفاق بیافتد:
1- سایز هر لینک بزرگ بشه
2- رنگ پس زمینه اون لینک تغییر کنه
3- رنگ فونت هم تغییر کنه
کد css مربوط به این کار چیه؟ اگر برای زیباتر شدن این مورد هم راه حل دارید لطفا بیان کنید.
با تشکر

kastakoorta
دوشنبه 12 تیر 1391, 15:50 عصر
a:link {color:green;}
a:visited {color:green;}
a:hover {color:red;}

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

a:hover {color:red;
font-size:150%;
text-decoration: underline;
}
یا مثال زیر تقریبا چیزیه که شما میخواین :

<style type="text/css">
A:link {background: #FFCC00; text-decoration: none}
A:visited {background: #FFCC00; text-decoration: none}
A:active {background: #FFCC00; text-decoration: none}
A:hover {background: #FFCC00; font-weight:bold; color: red;}
</style>

موفق باشید .

طبیب دل
دوشنبه 12 تیر 1391, 17:08 عصر
من یک کلاس css ساختم و مطالبی که گفتید رو توی کلاس نوشتم حالا چطور میشه که تگهای a رو به این کلاس مقید کنم ؟

davood59
دوشنبه 12 تیر 1391, 19:07 عصر
دوست عزیز ما برای اینکه صفحه Html رو مقید کنیم که از کدهایی که در css ایجاد کردیم تبعیت کنه 3 راه داریم که مرسوم ترین اون راهها ایجاد یک فایل جداگانه css هستش، بعد از اینکه فایل مورد نظر رو ایجاد کردیم با استفاده از کد زیر میتونیم بگیم که از فایل css واقع شده در مسیر مورد نظر استفاده کن.


<link href="StyleSheet2.css" rel="stylesheet" type="text/css" />

این قسمت رو تو تگ Head قرار می دیم.
یک راه دیگه هم هستش که در ابتدای صفحه Html میایم و کد Css رو میذاریم.
بعنوان مثال من برای سوال خودم از همین روش استفاده کردم که میتونید از این لینک (http://barnamenevis.org/showthread.php?349058-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D9%86%D9%88%D8%A7%D8%B1-%D8%A7%D8%A8%D8%B2%D8%A7%D8%B1-%D8%A8%D8%A7%D9%84%D8%A7%DB%8C-%D8%B5%D9%81%D8%AD%D9%87-%DA%AF%D9%88%DA%AF%D9%84-%DA%86%D9%86%D8%AF-%D8%B3%D9%88%D8%A7%D9%84-%D8%AF%D8%B1-%D9%87%D9%85%DB%8C%D9%86-%D8%B1%D8%A7%D8%A8%D8%B7%D9%87) مشاهده کنید. لازم به ذکر است که کلاس css رو تو تگ Head قرار دادم و بعد از تگ <head/> تگ body میاد و ادامه ماجرا.