انجمن


حاشیه دور عکس؟  (۱۴ نوشته)

  • natanzi

    آفلاین
    عضو
    تعداد نوشته‌ها: ۸۰
    تشکر شده: ۲ بار
    # نوشته شده: ۱۱ سال پیش
    ۲ تیر ۱۳۹۱ - ۲۳:۰۳

    دوستان چطور میشه دور عکسی که در ساید بار قرار داره یه حاشیه چیزی انداخت مثل یه جور قاب کردن که عکس رو از بقیه عکس ها متمایز کنه
    توجه کنید من چند تا عکس در ساید بار سمت راستم دارم میخوام یه جوری دورشو قاب کنم که متمایز بشن
    http://www.natanzi.ir/weblog

  • M.Dark

    آفلاین
    عضو
    تعداد نوشته‌ها: ۶
    تشکر شده: ۳ بار
    # نوشته شده: ۱۱ سال پیش
    ۳ تیر ۱۳۹۱ - ۰۱:۳۶

    بهشون padding بدید . ( css )

    کاربران زیر به‌خاطر این نوشته تشکر کرده‌اند:
    best designer
  • best designer

    آفلاین
    عضو
    تعداد نوشته‌ها: ۵۵۲
    تشکر شده: ۲۸۵ بار
    # نوشته شده: ۱۱ سال پیش
    ۳ تیر ۱۳۹۱ - ۰۹:۵۳

    دوستمون درست گفتن اما کامل نبود . حالا چطوری padding بدین ؟ کد زیر رو در css تون بزارین . به چند روش میتونید استفاده کنین .:

    #imagecol{
    padding:10px 5px 10px 5px !important; padding:10px 4px 10px 6px;
    color:#333;
    }

    حالا میتونید با img به تمام تصاویر حاشیه بدین این طوری :

    img{
    padding:10px 5px 10px 5px !important; padding:10px 4px 10px 6px;
    color:#333;
    }
    کاربران زیر به‌خاطر این نوشته تشکر کرده‌اند:
    natanzi
  • natanzi

    آفلاین
    عضو
    تعداد نوشته‌ها: ۸۰
    تشکر شده: ۲ بار
    # نوشته شده: ۱۱ سال پیش
    ۴ تیر ۱۳۹۱ - ۰۰:۳۴

    من کد اول رو به اخر استایلم اضافه کردم
    اما مثلا میخوام تواین کد که تو قسمت ابزارک دارم استفاده کنم و به اصطلاح تصویری که دادمو قاب کنم

    <p>
    <img border="0" src="http://www.natanzi.ir/weblog/wp-content/themes/Conventy/images/timthumb.gif" width="255" height="90">
    </p>

    چطور استفاده کنم؟

  • best designer

    آفلاین
    عضو
    تعداد نوشته‌ها: ۵۵۲
    تشکر شده: ۲۸۵ بار
    # نوشته شده: ۱۱ سال پیش
    ۴ تیر ۱۳۹۱ - ۱۰:۰۱

    اگه کد اول رو به style.css اضافه کردین به این شکل میتونید اجراش کنید :

    <div class="imagecol">
    <p>
    <img border="0" src="http://www.natanzi.ir/weblog/wp-content/themes/Conventy/images/timthumb.gif" width="255" height="90"></p>
    </div>

    منظورتون این بود ؟

  • natanzi

    آفلاین
    عضو
    تعداد نوشته‌ها: ۸۰
    تشکر شده: ۲ بار
    # نوشته شده: ۱۱ سال پیش
    ۴ تیر ۱۳۹۱ - ۱۸:۱۷

    بله اما عکس باید درو این کادر قرار بگیره چطور باید اینکارو انجام بدم؟
    ببینید http://www.natanzi.ir الان تصاویر پست های من رو نگاه کنید که تصویر شاخصه البته یه کادری دورش هست
    من میخوام تصاویر سمت راست من هم یه کادر مثل این بخوره
    (

  • shapoor

    آفلاین
    عضو
    تعداد نوشته‌ها: ۲۴۳
    تشکر شده: ۸۳ بار
    # نوشته شده: ۱۱ سال پیش
    ۹ تیر ۱۳۹۱ - ۰۸:۳۵

    city-sound گفت:
    دوستمون درست گفتن اما کامل نبود . حالا چطوری padding بدین ؟ کد زیر رو در css تون بزارین . به چند روش میتونید استفاده کنین .:

    #imagecol{
    padding:10px 5px 10px 5px !important; padding:10px 4px 10px 6px;
    color:#333;
    }

    حالا میتونید با img به تمام تصاویر حاشیه بدین این طوری :

    img{
    padding:10px 5px 10px 5px !important; padding:10px 4px 10px 6px;
    color:#333;
    }

    من کد اولی در فایل css قالبم گذاشتم ولی تغییری روی تصاویر ایجاد نشده یعنی اطراف تصاویر کادر نمیاد!!چرا؟

  • best designer

    آفلاین
    عضو
    تعداد نوشته‌ها: ۵۵۲
    تشکر شده: ۲۸۵ بار
    # نوشته شده: ۱۱ سال پیش
    ۹ تیر ۱۳۹۱ - ۱۴:۲۰

    کد اولی باید فراخوانی بشه اما کد دوم بصورت خود کار روی تمامی تصاویر عمل میکنه . پیشنهاد میکنم این کد رو بزارید هم ساده هست هم مقادیرش براحتی قابل تغییره :

    img {
    background-color : #f6f6f6;
    padding : 10px;
    }
    کاربران زیر به‌خاطر این نوشته تشکر کرده‌اند:
    shapoor
  • shapoor

    آفلاین
    عضو
    تعداد نوشته‌ها: ۲۴۳
    تشکر شده: ۸۳ بار
    # نوشته شده: ۱۱ سال پیش
    ۹ تیر ۱۳۹۱ - ۱۵:۳۹

    city-sound گفت:
    کد اولی باید فراخوانی بشه اما کد دوم بصورت خود کار روی تمامی تصاویر عمل میکنه . پیشنهاد میکنم این کد رو بزارید هم ساده هست هم مقادیرش براحتی قابل تغییره :

    img {
    background-color : #f6f6f6;
    padding : 10px;
    }

    خیلی ممنون
    الآن کادر انداخته ولی توبعضی سایتها دیدم وقتی ماوس میره روی تصویر هم تغییر رنگ میده وهم کادرش رنگش تغییر میکنه یعنی دراصل backgroundحالت پنهان داره با رفتن ماوس نمایان میشه
    اگر میشه کدش را بذارین

  • پویا آنلاین

    آفلاین
    عضو
    تعداد نوشته‌ها: ۵۴۵
    تشکر شده: ۳۳۳ بار
    # نوشته شده: ۱۱ سال پیش
    ۱۰ تیر ۱۳۹۱ - ۱۱:۴۵

    shapoor گفت:

    خیلی ممنون
    الآن کادر انداخته ولی توبعضی سایتها دیدم وقتی ماوس میره روی تصویر هم تغییر رنگ میده وهم کادرش رنگش تغییر میکنه یعنی دراصل backgroundحالت پنهان داره با رفتن ماوس نمایان میشه
    اگر میشه کدش را بذارین

    این کد را به استایل خود اضافه کنید:
    img:hover{ background: #000000 ; }

    کاربران زیر به‌خاطر این نوشته تشکر کرده‌اند:
    shapoor - infoinfo
  • natanzi

    آفلاین
    عضو
    تعداد نوشته‌ها: ۸۰
    تشکر شده: ۲ بار
    # نوشته شده: ۱۱ سال پیش
    ۱۶ تیر ۱۳۹۱ - ۲۰:۳۶

    دوست عزیز من قطعه کد اول رو در اخر فایل استالی اضافه کردم (همون کلاس)
    و کد فراخوانی را هم در ابزارک استفاده کردم اما تصویر را نمایش نمیده فقط پشت زمینه میاد!
    http://www.natanzi.ir

  • best designer

    آفلاین
    عضو
    تعداد نوشته‌ها: ۵۵۲
    تشکر شده: ۲۸۵ بار
    # نوشته شده: ۱۱ سال پیش
    ۱۷ تیر ۱۳۹۱ - ۱۰:۵۴

    این کدرو برای کلاس امتحان کنید :

    #imagecol {
    	padding:3px;
    	background-color:#e7e7e7;
    	-moz-border-radius:5px 5px 5px 5px;
    	border:1px #d3d3d3 solid;
    	opacity : 0.8;
    	align : center
    }
  • natanzi

    آفلاین
    عضو
    تعداد نوشته‌ها: ۸۰
    تشکر شده: ۲ بار
    # نوشته شده: ۱۱ سال پیش
    ۱۸ تیر ۱۳۹۱ - ۲۰:۴۰

    این کد را هم قرار دادم
    تصویر نمایش داده نمیشه فقط کادر خاکستری...
    http://www.natanzi.ir

  • natanzi

    آفلاین
    عضو
    تعداد نوشته‌ها: ۸۰
    تشکر شده: ۲ بار
    # نوشته شده: ۱۱ سال پیش
    ۲۷ تیر ۱۳۹۱ - ۱۹:۵۰

    دوستان من فقط میخوام دوره عکسم بکم برجسته بشه تا متمایز بشه همین
    از کد های بالا استفاده کردم اما فقط کادر خاکستری عکس رو نشون میده و خود عکس داخل نیست
    کسی هست راهنمایی کنه؟

درباره‌ی این موضوع



برچسب‌ها

هیچ برچسبی نیست.