WFruit | Fruit Supplier and Wholesale
نمایش نتایج: از 1 به 8 از 8

موضوع: راهنمایی برای ساخت این درجات کاربری

  1. Top | #1
    کاربر سایت

    تاریخ عضویت
    Dec 2014
    ورژن ویبولتین
    زیاد
    نوشته ها
    217
    مورد پسند
    228 بار
    اطلاعات
    Windows NT 6.3 Chrome 42.0.2311.135
    میزان امتیاز
    30

    پیش فرض

    سلام
    درجات کاربری سی اس اس دقیقا مثل لینک زیر رو میخوام ... تاکید دقیقا مثل همین لینک سایر تاپیک های درجات رو ندید خواهشا
    لینک

    فقط اگه تونستید اون قسمت کاپ رو تو درجه ها کدشو مشخص کنید تا عوضش کنم اگرم نشد مهم نیست



    خب خودم یکمی پیش رفتم و تونستم بسازمشون
    این کدها باید انتهای additional.css اضافه بشن :

    کد HTML:
    .p30web{text-align:center;color:#F4F4F4;font:14px Yekan,BYekan,B Yekan,Byekan,B yekan,byekan,b yekan,Tahoma;padding:7px 0px 10px;border-radius: 3px;line-height:18px;cursor:pointer;border-radius: 3px 3px 0px 0px;}
    .p30web-2{float:right;width:40px;height:35px;border-left:1px solid #3291D1;background:#3291D1;cursor:pointer;border-radius: 0px 3px 0px 0px;}
    
    .anmition{    -webkit-transition:all .4s ease-in-out;    -moz-transition:all .4s ease-in-out;    transition:all .4s ease-in-out;    border-bottom:4px solid #3291D1;        border-radius: 0px 0px 3px 3px;}.anmition:hover{
        -webkit-transform:translateY(-4px);    -moz-transform:translateY(-4px);    transform:translateY(-4px);    color:#fff}i.fa.fa-trophy {  text-align: center;  transform:translate(0px, 9px);  font-size: 21px;  color: #fff;}
    و اینم کد درجه هاست :
    کد HTML:
    <span class="rank"><div class="anmition"> <div class="p30web-2"><i class="fa fa-trophy"></i></div> <div class="p30web" style="background:#333;">مدير کل انجمن</div> </div></span>

    درجه بدون مشکل شاخته شدن و خودمم یکمی دورشونو گرد تر کردم
    فقط مشکل اینجاست اون علامت یا لوگو کاپ tropy رو نشون نمیده ... یه کد before هست ولی اونو توی کد ها نمیدونم کجا و جچوری استفاده کنم


    @p30web
    @FoX FuN
    @Regulator

    یه مشکل کوچیک اون کد کاپ کوچیک بغل درجه هاست ... خواهشا راهنمایی کنید
    ویرایش توسط PaSHa : 2015/05/02 در ساعت 05:34 PM دلیل: ادغام دو پست

    کاربر مقابل از PaSHa بابت این پست مفید تشکر کرده است:





  2. گیفت کارت آیتونز

  3. Top | #2
    پاسخگو و راهنمای سایت

    تاریخ عضویت
    Jan 2010
    ورژن ویبولتین
    all version
    نوشته ها
    7,281
    مورد پسند
    9,264 بار
    نوشته های وبلاگ
    73
    اطلاعات
    Windows 7/Server 2008 R2 Firefox 37.0
    میزان امتیاز
    924

    پیش فرض

    کد زیر را در additional.css قرار دهید :
    کد HTML:
    .p30web{
    text-align:center;
    color:#F4F4F4;
    font:14px Yekan,BYekan,B Yekan,Byekan,B yekan,byekan,b yekan,Tahoma;
    padding:7px 0px 10px;
    line-height:18px;
    cursor:pointer;
    }
    
    .p30web-2{
    float:right;
    width:40px;
    height:35px;
    border-left:1px solid #3291D1;
    background:#3291D1;
    cursor:pointer;
    
    
    }
    
    
    .anmition{
        -webkit-transition:all .4s ease-in-out;
        -moz-transition:all .4s ease-in-out;
        transition:all .4s ease-in-out;
        border-bottom:4px solid #3291D1;
    }
    .anmition:hover{
    
        -webkit-transform:translateY(-4px);
        -moz-transform:translateY(-4px);
        transform:translateY(-4px);
        color:#fff
    }
    i.fa.fa-trophy {
      text-align: center;
      transform:translate(0px, 9px);
      font-size: 21px;
      color: #fff;
    }
    

    ودر انتهای headinclude کد زیر را قرار دهید
    کد HTML:
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

    و کد زیر را در قسمت درجات کاربری استفاده کنید

    کد HTML:
    <div class="anmition"> <div class="p30web-2"><i class="fa fa-trophy"></i></div> <div class="p30web" style="background:#333;">مدير کل انجمن</div> </div>
    موفق باشید

    3 تشکر توسط:

    - سپیدار گیفت : فروش انواع فلش مموری تبلیغاتی و اختصاصی - فروش فلش کارتی + فروش انواع پاور بانک تبلیغاتی و اختصاصی

    - شرکت فرامحتوا - ارائه دهنده خدمات محتوایی

  4. Top | #3
    کاربر سایت

    تاریخ عضویت
    Dec 2014
    ورژن ویبولتین
    زیاد
    نوشته ها
    217
    مورد پسند
    228 بار
    اطلاعات
    Windows NT 6.3 Chrome 42.0.2311.135
    میزان امتیاز
    30

    پیش فرض

    نقل قول نوشته اصلی توسط p30web نمایش پست ها
    کد زیر را در additional.css قرار دهید :
    کد HTML:
    .p30web{
    text-align:center;
    color:#F4F4F4;
    font:14px Yekan,BYekan,B Yekan,Byekan,B yekan,byekan,b yekan,Tahoma;
    padding:7px 0px 10px;
    line-height:18px;
    cursor:pointer;
    }
    
    .p30web-2{
    float:right;
    width:40px;
    height:35px;
    border-left:1px solid #3291D1;
    background:#3291D1;
    cursor:pointer;
    
    
    }
    
    
    .anmition{
        -webkit-transition:all .4s ease-in-out;
        -moz-transition:all .4s ease-in-out;
        transition:all .4s ease-in-out;
        border-bottom:4px solid #3291D1;
    }
    .anmition:hover{
    
        -webkit-transform:translateY(-4px);
        -moz-transform:translateY(-4px);
        transform:translateY(-4px);
        color:#fff
    }
    i.fa.fa-trophy {
      text-align: center;
      transform:translate(0px, 9px);
      font-size: 21px;
      color: #fff;
    }
    

    ودر انتهای headinclude کد زیر را قرار دهید
    کد HTML:
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

    و کد زیر را در قسمت درجات کاربری استفاده کنید

    کد HTML:
    <div class="anmition"> <div class="p30web-2"><i class="fa fa-trophy"></i></div> <div class="p30web" style="background:#333;">مدير کل انجمن</div> </div>
    موفق باشید
    تشکر از شما
    اول عرض کنم واقعا درجه های زیباییه دستتون درد نکنه
    دوم اینکه من اون کد هارو اضافه کردم و نتیجه حاصله درست بود منتها اون لوگوی کاپ نمایش داده نمیشه (فقط مشکل اون لوگوی کوچیک کاپ سمت راسته)

    ببینید:
    سایر تیم ها این ده دروازه‌بان لیگ برتر 15-2014

  5. Top | #4
    پاسخگو و راهنمای سایت

    تاریخ عضویت
    Jan 2010
    ورژن ویبولتین
    all version
    نوشته ها
    7,281
    مورد پسند
    9,264 بار
    نوشته های وبلاگ
    73
    اطلاعات
    Windows 7/Server 2008 R2 Firefox 37.0
    میزان امتیاز
    924

    پیش فرض

    نقل قول نوشته اصلی توسط PaSHa نمایش پست ها
    تشکر از شما
    اول عرض کنم واقعا درجه های زیباییه دستتون درد نکنه
    دوم اینکه من اون کد هارو اضافه کردم و نتیجه حاصله درست بود منتها اون لوگوی کاپ نمایش داده نمیشه (فقط مشکل اون لوگوی کوچیک کاپ سمت راسته)

    ببینید:
    سایر تیم ها این ده دروازه‌بان لیگ برتر 15-2014
    این کد رو نیز در انتهای additional.css قرار بدید

    کد HTML:
    .fa-trophy:before {font-family: FontAwesome !important;}

    کاربر مقابل از p30web بابت این پست مفید تشکر کرده است:

    - سپیدار گیفت : فروش انواع فلش مموری تبلیغاتی و اختصاصی - فروش فلش کارتی + فروش انواع پاور بانک تبلیغاتی و اختصاصی

    - شرکت فرامحتوا - ارائه دهنده خدمات محتوایی

  6. Top | #5
    کاربر سایت

    تاریخ عضویت
    Dec 2014
    ورژن ویبولتین
    زیاد
    نوشته ها
    217
    مورد پسند
    228 بار
    اطلاعات
    Windows NT 6.3 Chrome 42.0.2311.135
    میزان امتیاز
    30

    پیش فرض

    نقل قول نوشته اصلی توسط p30web نمایش پست ها
    این کد رو نیز در انتهای additional.css قرار بدید

    کد HTML:
    .fa-trophy:before {font-family: FontAwesome !important;}

    فوق العاده مفید و زیبا
    خودم با یه دستور margin هم تنظیمش کردم و اوکی
    بازم تشکر میکنم درجات فوق العاده زیبا هستن ... بنظرم تو یه تاپیک مجزا آموزشش این مدل رو بذارید بد نباشه



    تاپیک بسته بشه لطفا
    ویرایش توسط PaSHa : 2015/05/02 در ساعت 06:49 PM

  7. Top | #6
    کاربر سایت

    تاریخ عضویت
    Jul 2014
    ورژن ویبولتین
    4.2.2
    سن
    27
    نوشته ها
    559
    مورد پسند
    81 بار
    نوشته های وبلاگ
    1
    اطلاعات
    Linux Chrome 30.0.1599.103
    میزان امتیاز
    62

    پیش فرض

    تصویر درجات رو نمی ذارین؟

  8. Top | #7
    کاربر مفید و فعال

    تاریخ عضویت
    Feb 2011
    ورژن ویبولتین
    3.8 و 4.2
    سن
    28
    نوشته ها
    600
    مورد پسند
    444 بار
    اطلاعات
    Windows 7/Server 2008 R2 Chrome 42.0.2311.135
    میزان امتیاز
    77

    پیش فرض

    نقل قول نوشته اصلی توسط تانوس نمایش پست ها
    تصویر درجات رو نمی ذارین؟
    درجات تصویری یا عکسی نیست، با css نوشته شده.



  9. Top | #8
    کاربر سایت

    تاریخ عضویت
    Sep 2011
    ورژن ویبولتین
    5
    نوشته ها
    5,336
    مورد پسند
    4,796 بار
    اطلاعات
    Windows NT 6.3 Firefox 37.0
    میزان امتیاز
    648

    پیش فرض

    نقل قول نوشته اصلی توسط تانوس نمایش پست ها
    تصویر درجات رو نمی ذارین؟
    نمونه در تاپیک زیر هست .

    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گراف

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

موضوعات مشابه

  1. پاسخ: 2108
    آخرين نوشته: 2018/02/22, 12:05 AM
  2. پاسخ: 2
    آخرين نوشته: 2013/06/24, 11:18 AM
  3. پاسخ: 0
    آخرين نوشته: 2012/10/22, 03:01 PM
  4. پاسخ: 3
    آخرين نوشته: 2012/04/20, 04:06 PM
  5. پاسخ: 3
    آخرين نوشته: 2011/06/19, 07:26 PM

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •