«
»

tabs لموقعك

Wednesday 14 January 2009

الروابط لا غنى عنها في اي موقع ويب 2.0، هذه طريقة لاستعمال الروابط كي تظهر في مكان بارز وبطريقة تلفت الانتباه

tabs

CSS:

ul {
	font-size: .9em;
	text-transform: uppercase;
	list-style: none;
	padding:1em;
	overflow: auto;
}
ul li {
	float: left;
	line-height: 30px;
	margin: 0 .5em 0 0;
}
ul li a {
	color: #333;
	display: block;
	padding: 0 0 0 .5em;
	text-decoration: none;
}
ul li a span {
	display: block;
	padding: 0 .5em 0 0;
}
ul li a:hover, ul li.current a {
	background: url(../images/bg.gif) no-repeat 0 0;
	color: #fff;
}
ul li.active a span,ul li.current a span, ul li a:hover span {
	background: url(../images/bg.gif) no-repeat 100% 0;
}
* html ul li a span {
    cursor: pointer;
    height: 45px;
    float: left;
}
* html ul li a {
	float:left
}

ان كان ملف style.css يحتاج لشرح، فضلا اترك ردا في التعليقات

5 تعليقات

  1. current page باستخدام PHP « cssguy says:
    January 14, 2009 at 3:48 pm

    [...] موقعك  ستحتاج الى اظهار الصفحة الحالية current page كما في الموضوع السابق، ولااظهار مكان تواجد الزائر، بإلقاء نظرة على الروابط [...]

  2. ازهار قلبي says:
    January 16, 2009 at 1:01 am

    طريقة مهمة كما ذكرت

    جزاك الله كل خير على هذا الشرح الرائع .

  3. إحسان says:
    January 23, 2009 at 11:04 am

    السلام عليكم ..
    جدًا جميلة :)
    سؤالي : ما فائدة استخدام الخاصية overflow ?

  4. cssbit says:
    January 23, 2009 at 8:38 pm

    كي تظهر كل button داخل الاطار

  5. cssbit says:
    January 23, 2009 at 8:38 pm

    احذف overflow وستفهم قصدي

التعليقات مغلقة.