گذاشتن دکمه ی csss\

این تاپیک 3 پاسخ و 2 مشارکت کننده دارد . آخرین آپدیت توسط :  ali215215 ،‏ 3 سال و 3 ماه پیش .

این تاپیک تاکنون 716 بازدید داشته است .

نویسنده پست
سه شنبه ، 30 جولای 2013     5:31 ب.ظ #


ali215215

Subscriber
12 پست7 تاپیک

با سلام

برای قرار دادن یک دکمه ی css در یک پست و فقط متخص به آن باید چکار کرد

مثلا این دکمه  ی خرید کالا در قسمت و درون خود نوشته باشد نه در کل سایت و یا در نوشته های دیگرر

لطفا راهنمایی بفرمایید

نمونه ای از کد
@import url(http://fonts.googleapis.com/css?family=Archivo+Narrow:400); @import url(http://fonts.googleapis.com/css?family=Archivo+Narrow:700); @tipcolor: #0099ff; .default(){ text-shadow: 1px 1px 0px #fff; font-weight: 400; color: #333; border: 1px solid #aaa; cursor: pointer; .rounded(4px); background: #feffe8; /* Old browsers */ background: -moz-linear-gradient(top, #feffe8 0%, #d6dbbf 100%); /* FF3.6+ */ background: -webkit-linear-gradient(top, #feffe8 0%,#d6dbbf 100%); /* Chrome10+,Safari5.1+ */ background: linear-gradient(to bottom, #feffe8 0%,#d6dbbf 100%); /* W3C */ .transition; &;:hover { background: -moz-linear-gradient(top, #fffce7 0%, #fdfd9f 100%); /* FF3.6+ */ background: -webkit-linear-gradient(top, #fffce7 0%,#fdfd9f 100%); /* Chrome10+,Safari5.1+ */ background: linear-gradient(to bottom, #fffce7 0%,#fdfd9f 100%); /* W3C */ } &;:active { background: -moz-linear-gradient(top, #f8c67a 0%, #e28904 49%, #f9ac39 50%, #f9d4a1 100%); /* FF3.6+ */ background: -webkit-linear-gradient(top, #f8c67a 0%,#e28904 49%,#f9ac39 50%,#f9d4a1 100%); /* Chrome10+,Safari5.1+ */ background: linear-gradient(to bottom, #f8c67a 0%,#e28904 49%,#f9ac39 50%,#f9d4a1 100%); /* W3C */ } } .textinset(@horizontal: 1px, @vertical: 1px, @blur: 0px, @color: #fff) { text-shadow: @horizontal @vertical @blur @color; } .inset(@dims:1px 1px 1px, @color:#fff) { box-shadow: @dims @color; // Opera, FFX4 -moz-box-shadow:@dims @color; // FFX3.5 -webkit-box-shadow:@dims @color; // Safari/Chrome/WebKit } .box-size() { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .rotate(@deg: 45deg) { -moz-transform: rotate(@deg); -webkit-transform: rotate(@deg); -o-transform: rotate(@deg); -ms-transform: rotate(@deg); transform: rotate(@deg); } .transition (@time: .4s, @range: all, @ease: ease-in) { -moz-transition: @range @time @ease; -webkit-transition: @range @time @ease; -o-transition: @range @time @ease; transition: @range @time @ease; } .transition-delay (@time: .2s) { -webkit-transition-delay: @time; -moz-transition-delay: @time; -o-transition-delay: @time; -transition-delay: @time; } .rounded(@radius: 5px) { -moz-border-radius:@radius; // FFX1-3.5 -webkit-border-radius:@radius; // Safari 3/Chrome 0.2 border-radius: @radius; } body { width: 100%; background: url(http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/grid.png) repeat #fefefe; } .wrap { width: 500px; margin: 100px auto; /* button stuffs */ button { font-family: 'Archivo Narrow', sans-serif; font-weight: bold; font-size: 36px; .textinset; color: #333; display: block; padding: 10px 30px; margin: 0 auto; min-width: 200px; .box-size; position: relative; z-index: 1; .inset; .default; /* span stuffs (tooltip) */ span { .box-size; position: absolute; padding: 10px; width: 190px; .rounded; .textinset(0,0,0); font-weight: normal; color: rgba(255,255,255,0); opacity: 0; font-size: 16px; .transition; .transition-delay; z-index: 1; .nub{ display: block; width: 10px; height: 10px; padding: 5px; border-style: solid; border-color: transparent; background: rgba(255,255,255,.8); .box-size; position: absolute; left: 42%; .rotate; z-index: 0; .transition; .transition-delay; .rounded(0px); } &;.top { top: 0px; left: 4px; .nub { left: 20%; bottom: -8px; } } &;.bottom { bottom: 0px; left: 4px; .nub { left: 20%; top: -8px; } } &;.left { top: 0px; left: 4px; .nub { left: 180px; top: 20px; } } &;.right { top: 0px; right: 4px; .nub { left: -8px; top: 20px; margin: 0 0 0 0; .transition; } } } &;:hover { span { background: @tipcolor; height: auto; color: #fff; font-size: 16px; opacity: 100; .transition; .transition-delay; .nub { .transition; .transition-delay; } &;.bottom { bottom: -60px; } &;.left { left: -193px; } &;.right { right: -193px; } &;.top { top: -60px; } } } } }
با تشکر

0  تشکر
سه شنبه ، 30 جولای 2013     10:44 ب.ظ #


meyti pugo

Subscriber
58 پست10 تاپیک

خب شما فقط درون همون div فراخوانی کنید.. یا اگر div از نوع class هست خودتن یک div بسازید   و فایل css رو فراخوانی کنید.. کدهایی هم که دادین خیلی بهم ریخته هستند..

1  تشکر
چهار شنبه ، 31 جولای 2013     3:44 ق.ظ #


ali215215

Subscriber
12 پست7 تاپیک

با سلام می شود کامل توضیح دهید
بنده در اینزمینه در حدیک جلبگ هم اطلعات ندارم
منظور از div و یا کلاس ان چیست و چگوه باید فایل css رو فراخوانی کرد
با تشکر

0  تشکر
پنجشنبه ، 8 آگوست 2013     12:39 ق.ظ #


ali215215

Subscriber
12 پست7 تاپیک

با سلام
می شه توضیح بدهید که اگر ما بخواهیم از دکمه های دیگر استفاده کنیم باید چکار کرد
به عنوان مال باید دکمه ی جدید را کجا آپلود کنیم و فرق پسوند های js و css در چی است و چگونه باید آپلود نمود
در ضمن کد فراخوانی برای یک دکمه مانند دکمه های پیش نمایش سایت شما چگونه است

با تشکر از شما

0  تشکر
پست 1 تا 4 (از مجموع 4 پست)

برای پاسخ دادن به این تاپیک باید وارد سایت شوید .