PDA

View Full Version : سوال: کمک برای css



h.torabi
شنبه 21 بهمن 1391, 14:32 عصر
سلام دو ستان من مدتی هست دارم با css کار می کنم

وبرای طراحی سایت از ان استفاده می کنم
ولی مدتی است که برای طراحی سایتی که در تمام مرور گر ها یکی باش دارم کار می کنم

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

که از آنها به عنوان روش هک کردن css نام میبرند

لطفا از دوستان حرفه ای می خوام که اگر کتاب یا سایت فارسی هست که بتواند این روش هارو به من

آموزش بدهد آن را معرفی کنند

اخه هرچی توی نت گشتم چیزی پیدا نکردم

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



<div id="bg">
<img src="images/bg.jpg" alt="">
</div>



#bg {
position:fixed;
top:-50%;
left:-50%;
width:200%;
height:200%;
}
#bg img {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
min-width:50%;
min-height:50%;
}



آدرس سایت (http://css-tricks.com)
لطفا پاسخ دهید
:افسرده:

ravand
شنبه 21 بهمن 1391, 16:29 عصر
ببینید . برای اینکه سایت شما در مرورگرهای مختلف سازگار بشه کارهای مختلفی میکنن مثلا ریست کردن مقادیر یا استفاده از PIE برای گرد کردن DIV و مثال های دیگه . شما بیشتر با تجربه می تونید این مشکلات رو حل کنید تا اینکه با یکی دو تا کد بتونید همه ی این مشکلات رو حل کنید. کم کم می فهمید از چه کدهایی استفاده کنید بهتره و باعث میشه سایت شما در همه ی مرورگر ها سازگار بشه.
الان در این روش شما عکست رو بذار زمینه ی div:

background-image:
url('http://s2.picofile.com/file/7201371070/onvan.jpg');
اینم یه راه برای سازگاری با مرورگرها:
http://www.barnamenevisi.blogsky.com/1390/09/14/post-89/

h.torabi
شنبه 21 بهمن 1391, 16:42 عصر
میشه در مورد این کد css که نوشتم یکم توضیح بدید اخه هر کاری میکنم که بفهمم نمی توانم

tamafi6
یک شنبه 22 بهمن 1391, 15:23 عصر
ازهک برای گول زدن مرورگرها استفاده میشه یعنی که با حقه کاری کنی تصویرت تواکثرمرورگرها به یک صورت نمایش داده بشه
این کد

#bg {
position:fixed;
top:-50%;
left:-50%;
width:200%;
height:200%;
}

یه محدوده که 50px- ازگوشه بالاوچپ درخارج ازمرورگربراش تعریف کرده به اون اندازه 200% داده شده تاکل صفحه راپرکنه بعد روی اون محدوده تصویرراقرارداده


[/#bg img {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
min-width:50%;
min-height:50%;
}CODE]
که برای مرورگربه صورت مطلق تعریف کرده چپ .بالا.راست .پایین صفره حقه اینجاس که براش ;min-height:50% تعریف کرده یعنی اگرمرورگربه مقدار50%بزرگنمایی شد تصویربرای این مقداربه صورت کامل نشان داده بشه واگر ازاین مقدارکمترشد تصویرراازسمت راست کوتاه کنه چون ازسمت چپ وبالا
[CODE]
top:-50%;
left:-50%;
این مقدارتعریف شده

khanlo.javid
یک شنبه 22 بهمن 1391, 15:46 عصر
برای اینکه بتونی یه وب سایت ایجاد کنی که تو همه ریزولیشن ها و مرورگر ها به درستی کار کنه به لینک زیر برو و تاپیک رو از اول تا آخر دنبال کن مطمئنن نتیجه میگیری

cross-browser (http://barnamenevis.org/showthread.php?217788-%DB%8C%DA%A9-%D9%86%D9%85%D9%88%D9%86%D9%87-%D8%B7%D8%B1%D8%A7%D8%AD%DB%8C-Cross-Browser)



موفق باشی.

h.torabi
دوشنبه 23 بهمن 1391, 13:00 عصر
سلام یک سوال دارم مگه وقتی می نویسه waidth=100%

کل صفحه تو ی هر نمایشگری گرهته نمیشه

حالا این 200% برای چیه؟؟؟؟؟؟؟