Admin
الاداره العامه
المساهمات : 1902 تاريخ التسجيل : 08/07/2014 العمر : 26 الموقع : https://global.hooxs.com
| موضوع: قالب حقوق اسفل المنتدى الثلاثاء ديسمبر 08, 2015 12:17 pm | |
| السلام عليكم في اول محاولة لي قالب حقوق متعدد اسفل المنتدى مثال على القالب الكود - الكود:
-
<div style="text-align: center;"> <br /> </div> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><title>Untitled 1</title><style type="text/css">.tabs {position: relative;margin: 20px auto;width: 77%;border-radius: 0 0 8px 8px;box-shadow: #0066ff 0px 10px 0px;}.tabs input {position: absolute;z-index: 1000;width: 120px;height: 40px;right: 0px;top: 0px;opacity: 0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);cursor: pointer;}.tabs input#tab-2{right: 120px;}.tabs input#tab-3{right: 240px;}.tabs input#tab-4{right: 360px;}.tabs label {background: #0066ff;background: -moz-linear-gradient(top, #0066ff 0%, #0EA2CB 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0066ff), color-stop(100%,#0EA2CB));background: -webkit-linear-gradient(top, #0066ff 0%,#0066ff 100%);background: -o-linear-gradient(top, #0066ff 0%,#0EA2CB 100%);background: -ms-linear-gradient(top, #0066ff 0%,#0EA2CB 100%);background: linear-gradient(top, #0066ff 0%,#0EA2CB 100%);font-size: 15px;font-family: 'Exo 2', 'Droid Arabic Kufi';line-height: 40px;height: 40px;position: relative;padding: 0 20px;float: right;display: block;width: 80px;color: #F1F9FC;letter-spacing: 1px;text-transform: uppercase;font-weight: bold;text-align: center;text-shadow: 1px 1px 1px rgba(255,255,255,0.3);border-radius: 3px 3px 0 0;box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1);}.tabs label:after {content: '';background: #F1F9FC;position: absolute;bottom: -2px;right: 0;width: 100%;height: 2px;display: block;color:#000;}.tabs input:hover + label {background: #0EA2CB;}.tabs label:first-of-type {z-index: 4;box-shadow: 2px 0 2px rgba(0,0,0,0.1);}.tab-label-2 {z-index: 3;}.tab-label-3 {z-index: 2;}.tab-label-4 {z-index: 1;}.tabs input:checked + label {background: #F1F9FC;z-index: 6;color: #2F60AD;}.tabs input:checked + label {background: #F1F9FC;z-index: 6;color: #2F60AD;}.clear-shadow {clear: both;}.content01 {background: #F1F9FC;position: relative;width: 100%;height: 300px;z-index: 5;box-shadow: 0 -2px 3px -2px rgba(9,74,63,1.0), 0 2px 2px rgba(9,74,63,1);border-radius: 0 3px 3px 3px;}.content01 div {position: absolute;top: 0;right: 0;padding: 10px 40px;z-index: 1;opacity: 0;-webkit-transition: opacity linear 0.1s;-moz-transition: opacity linear 0.1s;-o-transition: opacity linear 0.1s;-ms-transition: opacity linear 0.1s;transition: opacity linear 0.1s;}.tabs input.tab-selector-1:checked ~ .content01 .content-1,.tabs input.tab-selector-2:checked ~ .content01 .content-2,.tabs input.tab-selector-3:checked ~ .content01 .content-3,.tabs input.tab-selector-4:checked ~ .content01 .content-4 {z-index: 100;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);opacity: 1;-webkit-transition: opacity ease-out 0.2s 0.1s;-moz-transition: opacity ease-out 0.2s 0.1s;-o-transition: opacity ease-out 0.2s 0.1s;-ms-transition: opacity ease-out 0.2s 0.1s;transition: opacity ease-out 0.2s 0.1s;}.content01 div h2,.content01 div h3{color: #0066ff;font-family: 'Exo 2', 'Droid Arabic Kufi';}.content01 div p {font-size: 14px;line-height: 22px;font-style: italic;text-align: right;margin: 0;color: #777;padding-right: 15px;font-family: 'Exo 2', 'Droid Arabic Kufi';border-right: 8px solid rgba(110,243,220, 1.);}/* tooltip auto all link */a.tooltip {position: relative;}a.tooltip::before {content: attr(data-tooltip);font-size: 12px;position: absolute;z-index: 999;white-space: nowrap;bottom: 9999px;left: 0;background: rgba(0, 0, 0, 0.7);border-radius: 5px;-webkit-border-radius: 5px;-mos-border-radius: 5px;color: #e0e0e0;padding: 0px 7px;line-height: 24px;height: 24px;opacity: 0;}a.tooltip:hover::before {opacity: 1;top: 22px;}a.tooltip:hover::after {content: "";opacity: 1;width: 0;height: 0;border-left: 5px solid transparent;border-right: 5px solid transparent;border-bottom: 5px solid black;z-index: 999;position: absolute;white-space: nowrap;top: 17px;left: 50%;}</style> <div class="tabs"> <input id="tab-1" name="radio-set" class="tab-selector-1" checked="checked" type="radio" /><label for="tab-1" class="tab-label-1">من نحن</label><input id="tab-2" name="radio-set" class="tab-selector-2" type="radio" /><label for="tab-2" class="tab-label-2">خدماتنا</label><input id="tab-3" name="radio-set" class="tab-selector-3" type="radio" style="left: 333px" /><label for="tab-3" class="tab-label-3">أصدقاء</label><input id="tab-4" name="radio-set" class="tab-selector-4" type="radio" /><label for="tab-4" class="tab-label-4">الحقوق</label> <div class="clear-shadow"> </div> <div class="content01"> <div class="content-1"> <h2> من نحن </h2> <p> (اسم منتداك) </p> <p> لسنا متخصصين بشئ فكل شئ من إختصاصنا ...<a href="#">اقرأ المزيد</a>. </p> <h3> أهدافنا </h3> <p> خلقنا لنرسم طريقا من الإبداع لنسلكه ويسلكه الاخرون من بعدنا. </p> </div> <div class="content-2"> <h2> خدماتنا </h2> <p> نمد يد العون لجميع اصحاب المواقع ، ونجيب عن جميع استفساراتهم قدر الامكان <br />كما نتطلع دائما لطرح الجديد والمفيد لهم<br /> جميع خدماتنا مجانية عدا الاعمال الحصرية التي تم الصرف عليها </p> <h3> الدعم الفني </h3> <p> خصصنا هذة الخدمة لاصحاب المواقع الجديدة ، وكذلك لمن تنقصه الخبره في تولي ادارة المواقع </p> </div> <div class="content-3"> <h2> مواقع صديقة </h2> <p> اسم موقع </p> <p> اسم موقع </p> <p> اسم موقع </p> <h3> لماذا هذه المواقع ؟ </h3> <p> هذا المساحة خصصت لإعضاء (اسم منتداك) الذين يملكون مواقع مفيدة ، وحيث ترى إدارة (اسم منتداك) ان هذه المواقع لها العديد من المواضيع المفيدة و القيمة التي تستحق الاشاده بها </p> </div> <div class="content-4"> <h2> الحقوق </h2> <p> <br /><strong>المشاركات والمواضيع تعبر عن رأي كاتبها وليس بالضرورة رأي </strong> (اسم منتداك)<strong> <br /> وجميع الحقوق محفوظة لاصحابها</strong> </p> <p> <span style="color: rgb(0, 102, 255); font-size: 13px;">تاريخ انشاء الموقع</span><strong><br /></strong> </p> <p> 25 - 12 - 2013 </p> <p> <br /> </p> <p> Mc Nabulsy </p> </div> </div> </div> <div style="padding: 6px 0px 0px;"> <br /> </div>
يمكنك وضع القالب من خلال لوحة الادارة - مظهر المنتدى - الادارة العامة للتومبيلات و قم بالتعديل على (overall_footer_begin) وضع الكود في البداية
ان شاء الله يكون عجبكم
والسلام ختام
| |
|
فارس الجزائر
الاداره العامه
المساهمات : 26 تاريخ التسجيل : 10/12/2015 الموقع : http://rabi3-el-hayat.cf
| موضوع: رد: قالب حقوق اسفل المنتدى الخميس ديسمبر 31, 2015 1:00 pm | |
| كود في قمة الروعة
تسلم على المجهود
واصل ابداعك | |
|