آموزش اضافه کردن باکس کاربرتر ماه / کاملا فلت و بسیار زیبا (اختصاصی)
امتیاز:

درود .
بعد از چند ماه با دست پر اومدم
بریم سر اصل مطلب :d
:
ابتدا به headinclude_bottom برین و کد زیر رو که مربوط به اتصال فونت ایکون به قالب هست رو قرار بدید
توجه : اگر میخواهید که در این مرحله میتوانید تولتیپ اضافه کنید (توی باکس خیلی قشنگ میشه !)کد:<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
خب بعدش میریم سراغ header یا ناو بار فرقی نداره / اما من اینجا هدر رو میرم / و در زیر
این کد هارو اضافه کنید :کد:<div id="header" class="floatcontainer doc_header">
* خیلی مرتبنکد:<div id="bestuser"> <ul> <img src="http://8pic.ir/images/i5qzvifba6d4v27r1vgb.png"></img> <div id="txt"> <h1>MISFeasAnCE</h1> <h2><a href="#"><i class="fa fa-external-link"></i>طراح وب</a></h2> <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.</p> </div> </ul> <li> <div id="iconha"> <i id="tashakor" class="fa fa-heart fa-lg" rel="tooltip" title="تشکرشده"> <span>310</span></i> <i id="cheshm" class="fa fa-eye fa-lg" rel="tooltip" title="نوشته ها"> <span>127</span></i> <i id="raay" class="fa fa-user fa-2x" rel="tooltip" title="تعداد رای ها"> <span>853</span></i> </div> </li>اصن توجه نکردین *
بعدش برین به additional.css و اضافه کنید :
تموم شد .کد:/*********** Best user ****************/ #bestuser { float:left; width:330px; height:150px; background:#fff; margin:5% 0 0 2%; border-radius:3px; font-family:yekan,verdana; border-bottom: 40px solid #4EB6B6; } #bestuser ul { margin-top:5%; text-align:center; } #bestuser ul p { margin: 4%; width: 180px; color:#A5A5A5; } #bestuser ul img { float: left; border-radius: 50%; margin:5% 0 0 28px; border: 3px solid #DBDBDB; } #txt{ top:6px; right: 5px; position: relative; } #bestuser ul h1{ color:#658585; font-size:17px; } #bestuser ul h2 a{ color:#F2765C; text-decoration: none; font:16px yekan,FontAwesome; } #bestuser ul h2 a i{ top: 4px; left: 5px; margin-top: 2px; position: relative; } #iconha{ color: #E3EEEE; } #iconha span{ font-size:17px; } #tashakor{ float:left; margin: 7.7% 7%; } #cheshm{ float:left; margin: 6.7% 7%; font-size: 24px; } #cheshm span{ font-size: 14px; } #raay{ float:left; margin: 5.7% 7%; font-size: 24px; } /*********** End Of Best user *********/
توجه مهم : 1- در بعضی استایل ها ممکنه داس هدر زیاد ارتفاء نداشته باشه به همین دلیل شاید به هم ریخته شه برای حل این مشکل میتونید کد هارو زیر ناوبار بزارین یا ارتفاء داس هدر رو زیاد کنین .
2- حتما تعداد کراکتر های بیوگرافی باید 70 تا باشه / باز تاکید میکنم 70 .
موفق باشید
علاقه مندی ها (Bookmarks)