ehsanchch 6 ارسال شده در اسفند 1، 1396 گزارش اشتراک گذاری ارسال شده در اسفند 1، 1396 سلام وقتتون بخیر دارم ایکون های شبکه اجتماعی رو در یه برگه وردپرس جای سازی میکنم ولی تو یه سطح قرار نمیگرن و زیر هم میان راهی داره که کنار هم قرار بگیرن تصویر پیوست اول منظورم رو نمایش میده در کد زیر هم کد رو توی ویرایش گر در حالت یه جدول منتشر کردم گفتم شاید باعث مرتب سازیش بشه و بیان کنار هم ولی بازم بعد از ذخیره کنار هم نبود و رفتن زیر هم [su_column size="1/1"]<div class="social"> <a href="https://go.20script.ir/index.php?url=https://facebook.com/ondrej.p.barta" class="link facebook" target="_parent"><span class="fa fa-facebook-square"></span></a> <a href="https://go.20script.ir/index.php?url=https://twitter.com/PageOnlineXS" class="link twitter" target="_parent"><span class="fa fa-twitter"></span></a> <a href="https://go.20script.ir/index.php?url=https://plus.google.com/+OndřejBárta-Otaku" class="link google-plus" target="_parent"><span class="fa fa-google-plus-square"></span></a> </div>[/su_column] اینم css .social { position: absolute; width: 100%; top: 50%; text-align: center; transform: translateY(-50%); } .social .link { display: inline-block; vertical-align: middle; position: relative; width: 150px; height: 150px; border-radius: 50%; border: 2px dashed white; background-clip: content-box; padding: 10px; transition: .5s; color: #D7D0BE; margin-left: 15px; margin-right: 15px; font-size: 70px; } .social .link span { display: block; position: absolute; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); } .social .link:hover { padding: 20px; color: white; margin-left: -5px; transform: translateX(10px) rotate(360deg); } .social .link.google-plus { background-color: tomato; color: white; } .social .link.twitter { background-color: #00ACEE; color: white; } .social .link.facebook { background-color: #3B5998; color: white; } البته توی فایل جداگانه html پیادش میکنم درسته ولی نمیدونم چرا در وردپرس با مشکل مواجه میشم لینک ها تنها برای اعضای سایت قابل نمایش است. لینک به دیدگاه به اشتراک گذاری در سایت های دیگر More sharing options...
Masih 6,279 ارسال شده در اسفند 1، 1396 گزارش اشتراک گذاری ارسال شده در اسفند 1، 1396 درود. این رو تست کنید: کد HTML: <div class="social"> <a href="https://facebook.com/ondrej.p.barta" class="link facebook" target="_parent"><span class="fa fa-facebook-square"></span></a> <a href="https://twitter.com/PageOnlineXS" class="link twitter" target="_parent"><span class="fa fa-twitter"></span></a> <a href="https://plus.google.com/+OndřejBárta-Otaku" class="link google-plus" target="_parent"><span class="fa fa-google-plus-square"></span></a> </div> و کدهای CSS : کدهای قبلی که داخل تاپیک گفتید هم شامل میشه پس کدهای CSS قبلیتون رو پاک کنید از قالب: .social { position: absolute; width: 100%; top: 50%; text-align: center; transform: translateY(-50%); display: inline-flex; } .social .link { display: inline-block; vertical-align: middle; position: relative; width: 150px; height: 150px; border-radius: 50%; border: 2px dashed white; background-clip: content-box; padding: 10px; transition: .5s; color: #D7D0BE; margin-left: 15px; margin-right: 15px; font-size: 70px; } .social .link span { display: block; position: absolute; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); } .social .link:hover { padding: 20px; color: white; margin-left: -5px; transform: translateX(10px) rotate(360deg); } .social .link.google-plus { background-color: tomato; color: white; } .social .link.twitter { background-color: #00ACEE; color: white; } .social .link.facebook { background-color: #3B5998; color: white; } لینک به دیدگاه به اشتراک گذاری در سایت های دیگر More sharing options...
پست های پیشنهاد شده
بایگانی شده
این موضوع بایگانی و قفل شده و دیگر امکان ارسال پاسخ نیست.