کد های سی اس مربوطه:
وکد:/*** * - mooRainbow: defaultCSS * author: w00fz <w00fzIT@gmail.com> */ #mooRainbow { font-size: 11px; color: #000; } .moor-box { width: 390px; height: 310px; border: 1px solid #636163; background-color: #f9f9f9; } .moor-overlayBox { width: 256px; /* Width and Height of the overlay must be setted here: default 256x256 */ height: 256px; margin-top: 9px; margin-left: 9px; border: 1px solid #000; } .moor-slider { border: 1px solid #000; margin-top: 9px; margin-left: 280px; width: 19px; /* if you want a bigger or smaller slider... */ height: 256px; } .moor-colorBox { border: 1px solid #000; width: 59px; height: 68px; margin-top: 20px; margin-left: 315px; } .moor-currentColor { /* Bottom Box Color, the backup one */ margin-top: 55px; margin-left: 316px; width: 59px; height: 34px; } .moor-okButton { font-family: Tahoma; font-weight: bold; font-size: 11px; margin-top: 278px; margin-left: 8px; background: #e6e6e6; height: 23px; border: 1px solid #d6d6d6; border-left-color: #f5f5f5; color:#000000; border-top-color: #f5f5f5; } #mooRainbow label { font-family: mono; } /* Following are just <label> */ .moor-rLabel { margin-top: 100px; margin-left: 315px; } .moor-gLabel { margin-top: 125px; margin-left: 315px; } .moor-bLabel { margin-top: 150px; margin-left: 315px; } .moor-HueLabel { margin-top: 190px; margin-left: 315px; } span.moor-ballino { /* Style hue � (degree) !! */ margin-top: 190px; margin-left: 370px; } .moor-SatuLabel { margin-top: 215px; margin-left: 315px; } .moor-BrighLabel { margin-top: 240px; margin-left: 315px; } .moor-hexLabel { margin-top: 275px; margin-left: 280px; } /* <input> */ .moor-rInput, .moor-gInput, .moor-bInput, .moor-HueInput, .moor-SatuInput, .moor-BrighInput { width: 30px; } .moor-hexInput { width: 55px; } .moor-cursor { background-image: url(../images/moor_cursor.gif); width: 12px; height: 12px; } .moor-arrows { background-image: url(../images/moor_arrows.gif); top: 9px; left: 270px; width: 41px; height: 9px; } .moor-chooseColor { /* Top Box Color, the choosen one */ margin-top: 21px; margin-left: 316px; width: 59px; height: 34px; }
کد:/* Skitter styles */@font-face { font-family: 'BebasNeueRegular'; src: url('../fonts/bebas-neue-fontfacekit/BebasNeue-webfont.eot'); src: url('../fonts/bebas-neue-fontfacekit/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/bebas-neue-fontfacekit/BebasNeue-webfont.woff') format('woff'), url('../fonts/bebas-neue-fontfacekit/BebasNeue-webfont.ttf') format('truetype'), url('../fonts/bebas-neue-fontfacekit/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'CaviarDreamsBold'; src: url('../fonts/Caviar-Dreams-fontfacekit/CaviarDreams_Bold-webfont.eot'); src: url('../fonts/Caviar-Dreams-fontfacekit/CaviarDreams_Bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Caviar-Dreams-fontfacekit/CaviarDreams_Bold-webfont.woff') format('woff'), url('../fonts/Caviar-Dreams-fontfacekit/CaviarDreams_Bold-webfont.ttf') format('truetype'), url('../fonts/Caviar-Dreams-fontfacekit/CaviarDreams_Bold-webfont.svg#CaviarDreamsBold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'LillyRegular'; src: url('../fonts/Lilly-fontfacekit/Lilly__-webfont.eot'); src: url('../fonts/Lilly-fontfacekit/Lilly__-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Lilly-fontfacekit/Lilly__-webfont.woff') format('woff'), url('../fonts/Lilly-fontfacekit/Lilly__-webfont.ttf') format('truetype'), url('../fonts/Lilly-fontfacekit/Lilly__-webfont.svg#LillyRegular') format('svg'); font-weight: normal; font-style: normal; } .box_skitter {position:relative;width:800px;height:300px;background:#000;} .box_skitter ul {display:none; } .box_skitter .container_skitter {overflow:hidden;position:relative;} .box_skitter .image {overflow:hidden;} .box_skitter .image img {display:none;} .box_skitter .box_clone {position:absolute;top:0;left:0;width:100px;overflow:hidden;display:none;z-index:1;} .box_clone img {position:absolute;top:0;left:0; z-index:1;} .prev_button {position:absolute;top:50%;left:10px;z-index:100;width:42px;height:42px;overflow:hidden;text-indent:-9999em;margin-top:-25px;background:url(../images/prev.png) no-repeat left top;} .box_skitter .next_button {position:absolute;top:50%;right:10px;z-index:100;width:42px;height:42px;overflow:hidden;text-indent:-9999em;margin-top:-25px;background:url(../images/next.png) no-repeat left top;} .box_skitter .info_slide {position:absolute;top:15px;left:15px;background:#000;color:#fff;font:bold 11px arial;padding:5px 0 5px 5px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;opacity:0.75;z-index:2;} .box_skitter .info_slide .image_number {background:#333;float:left;padding:2px 10px;margin:0 5px 0 0;cursor:pointer;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;} .box_skitter .info_slide .image_number_select {background:#cc0000;float:left;padding:2px 10px;margin:0 5px 0 0;} .box_skitter .container_thumbs {position:relative;overflow:hidden;height:50px;} .box_skitter .info_slide_thumb {-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;overflow:hidden;height:45px;top:auto;bottom:-5px;left:-5px;padding:5px;opacity:1.0;} .box_skitter .info_slide_thumb .image_number {overflow:hidden;width:70px;height:40px;position:relative;} .box_skitter .info_slide_thumb .image_number img {position:relative;top:-50px;left:-50px} .box_skitter .box_scroll_thumbs {padding:0 10px;} .box_skitter .box_scroll_thumbs .scroll_thumbs {position:absolute;bottom:60px;left:50px;background:#ccc;background:-moz-linear-gradient(-90deg, #555, #fff);background:-webkit-gradient(linear, left top, left bottom, from(#555), to(#fff));width:200px;height:10px;overflow:hidden;text-indent:-9999em;z-index:101;-moz-border-radius:20px;-webkit-border-radius:20px;border-radius:20px;cursor:pointer;border:1px solid #333;} .box_skitter .info_slide_dots {position:absolute;bottom:-40px;z-index:100;padding:5px 0 5px 5px;-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;} .box_skitter .info_slide_dots .image_number {background:#333;float:left;margin:0 5px 0 0;cursor:pointer;-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;width:18px;height:18px;text-indent:-9999em;overflow:hidden;position:relative;} .box_skitter .info_slide_dots .image_number_select {background:#cc0000;float:left;margin:0 5px 0 0;} .box_skitter .label_skitter {z-index:50;position:absolute;bottom:0px;left:0px;display:none;} .loading {position:absolute; top:50%; right:50%; z-index:10000; margin:-16px -16px;color:#fff;text-indent:-9999em;overflow:hidden;background:url(../images/ajax-loader.gif) no-repeat left top;width:32px;height:32px;} /** * Example for dimenions: */ .box_skitter_small {width:200px;height:200px;} .label_skitter {z-index:50;position:absolute;bottom:0px;left:0px;background:url(../images/back-box-label-black.png) repeat-x left top;color:#fff;display:none;border-top:1px solid #000;} .label_skitter p {} .info_slide * {font-family:Consolas,arial,tahoma !important;}
چطوری وسط چین کنم/؟
علاقه مندی ها (Bookmarks)