گرافیک باکس های این سایت به چه روشی سی اس اس نویسی شده است؟

[phpnet 0]

با سلام

سایت زیر باکس های ماژول خیلی قشنگی داره وقتی میخواییم تصاویر به کار رفته را ببینیم جدا از هم نیست کسی میدونه به چه روشی سی اس اس نویسی کرده اند؟

http://www.joomlahackers.net

[عبدالله عصمتی 35]

با سلام

سایت زیر باکس های ماژول خیلی قشنگی داره وقتی میخواییم تصاویر به کار رفته را ببینیم جدا از هم نیست کسی میدونه به چه روشی سی اس اس نویسی کرده اند؟

http://www.joomlahackers.net

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

این کدای این سایته

/*

* module: chrome

*/



div.mod-chrome div.box-t1 { background: url(/templates/jh/images/module_chrome_white.png) 0 0 no-repeat; }



div.mod-chrome div.box-t2 {

padding: 0px 15px 0px 15px;

background: url(/templates/jh/images/module_chrome_white.png) 100% -45px no-repeat;

}



div.mod-chrome div.box-t3 {

height: 40px;

background: url(/templates/jh/images/module_chrome_white.png) 0 -90px repeat-x;

}



div.mod-chrome div.box-1 {

padding: 0px 6px 0px 6px;

border-left: 1px solid #D2D2D2;

border-right: 1px solid #D2D2D2;

background: #F0F1F2;

}



div.mod-chrome div.box-2 {

padding: 0px 8px 0px 8px;

background: #141414 url(/templates/jh/images/module_chrome_white.png) 0 -195px repeat-x;

overflow: hidden;

color: #c8c8c8;

}



div.mod-chrome div.box-b1 { background: url(/templates/jh/images/module_chrome_white.png) 0 -135px no-repeat; }



div.mod-chrome div.box-b2 {

padding: 0px 15px 0px 15px;

background: url(/templates/jh/images/module_chrome_white.png) 100% -155px no-repeat;

}



div.mod-chrome div.box-b3 {

height: 15px;

background: url(/templates/jh/images/module_chrome_white.png) 0 -175px repeat-x;

}



div.mod-chrome h3.header { line-height: 35px; }

div.mod-chrome h3.header span.subtitle { margin-top: -5px; }

div.mod-chrome h3.header span.icon { top: 2px; }



/* color: black */

div.mod-chrome-black div.box-t1 { background-image: url(/templates/jh/images/module_chrome_black.png); }

div.mod-chrome-black div.box-t2 { background-image: url(/templates/jh/images/module_chrome_black.png); }

div.mod-chrome-black div.box-t3 { background-image: url(/templates/jh/images/module_chrome_black.png); }



div.mod-chrome-black div.box-1 {

border-left: 1px solid #000000;

border-right: 1px solid #000000;

background: #1E1E1E;

}



div.mod-chrome-black div.box-2 {

background: #F0F1F2 url(/templates/jh/images/module_chrome_black.png) 0 -195px repeat-x;

color: #323232;

}



div.mod-chrome-black div.box-b1 { background-image: url(/templates/jh/images/module_chrome_black.png); }

div.mod-chrome-black div.box-b2 { background-image: url(/templates/jh/images/module_chrome_black.png); }

div.mod-chrome-black div.box-b3 { background-image: url(/templates/jh/images/module_chrome_black.png); }



div.mod-chrome-black h3.header { color: #ffffff; }

div.mod-chrome-black h3.header span.subtitle { color: #c8c8c8; }