PDA

View Full Version : سوال: نمایش درست سایت در مرورگرها



طبیب دل
شنبه 06 آبان 1391, 10:00 صبح
با سلام به دوستان
من تو سایتم از css3 استفاده میکنم در مرورگر firefox هیچ مشکلی ندارم ولی تو مرورگرهایی مثل ie مواردی مثل border-radiuse رو نشون نمیده و در کد css هم که میخوام از -msborder-radius استفاده کنم همچین چیزی نداره.
چی کار کنم؟
با تشکر

زینب فاطمی
شنبه 06 آبان 1391, 13:21 عصر
سلام
این لینک رو مطالعه کنید :http://saleh.soozanchi.ir/1389/06/16/how-to-use-css3-in-internet-explorer/

طبیب دل
دوشنبه 08 آبان 1391, 08:11 صبح
سلام
این لینک رو مطالعه کنید :http://saleh.soozanchi.ir/1389/06/16/how-to-use-css3-in-internet-explorer/
خیلی ممنون کارهایی که در این لینک گفت رو انجام دادم
ولی زیر دستور behavior در فایل css یک خط سبز گذاشته و در IE هم border-radiuds رو نشون میده ولی افکت رو انجام نمیده
برای مرورگر chrome باید چی کار کنم؟

زینب فاطمی
دوشنبه 08 آبان 1391, 14:44 عصر
سلام
منظورتون رو از خط سبز درفایل css متوجه نشدم . چون در فایل من اینطوری نیست . چه افکتی استفاده می کنید ؟
برای مرورگر کروم هم پیشوند مشخصه مروگر را در ابتداي ویژگی اضافه کنید ببینید درست میشه .
مثال زیر رو ببینید مشخصه چند تا مرورگر رو آورده :

div.use-border-radius{ width : 300px; height : 300px; background : gray; border-radius:15px; -moz-border-radius:15px; /* mozilla */ -o-border-radius:15px; /* opera */ -webkit-border-radius:15px; /* chrome */

طبیب دل
دوشنبه 08 آبان 1391, 20:09 عصر
سلام
منظورتون رو از خط سبز درفایل css متوجه نشدم . چون در فایل من اینطوری نیست . چه افکتی استفاده می کنید ؟
برای مرورگر کروم هم پیشوند مشخصه مروگر را در ابتداي ویژگی اضافه کنید ببینید درست میشه .
مثال زیر رو ببینید مشخصه چند تا مرورگر رو آورده :

div.use-border-radius{ width : 300px; height : 300px; background : gray; border-radius:15px; -moz-border-radius:15px; /* mozilla */ -o-border-radius:15px; /* opera */ -webkit-border-radius:15px; /* chrome */
منظورم از خط سبز اینکه وقتی موس رو میرم روی دستورbehavior پیغام زیر رو میده
'behavior is not a know css property name'

طبیب دل
سه شنبه 09 آبان 1391, 12:38 عصر
کسی نظری نداره . من همچنان با IEمشکل دارم

زینب فاطمی
سه شنبه 09 آبان 1391, 13:35 عصر
ورژن IE تون چنده ؟

طبیب دل
سه شنبه 09 آبان 1391, 15:12 عصر
ورژن IE تون چنده ؟
ورژن IE 8

زینب فاطمی
سه شنبه 09 آبان 1391, 15:32 عصر
ie منم 8 هست پس چرا من مشکل ندارم . میشه کدتون رو بذارید ؟

طبیب دل
سه شنبه 09 آبان 1391, 18:14 عصر
فایل css رو ضمیمه کردم
فایل PIE.htc رو تو ریشه برنامه اضافه کردم
دیگه نمیدونم باید چی کار کنم؟

body
{
direction:rtl;
background-image: url('../Images/Middle_texture.jpg');
margin:0;
padding:0;
}
div.upHeader
{
height:5%;

}

div.header
{
/* direction:rtl;*/
border-style : none;
border-color: inherit;
border-width: 4;
height:104px;
background-image:url('../Images/header1.jpg');
border-radius:14px;
-webkit-border-radius:14px;
-moz-border-radius:14px;
-o-border-radius:14px;
margin:30px 35px 10px 35px;
behavior:url(PIE.htc);
/*text-align:right;*/
}
div.divMenu
{
width:50px;
}
div.main
{
height:60%;

}

div.footer
{

height:15%;
font-family:B Mitra;
font-weight:bold;
font-size:large;
text-align:center;
margin:10px 35px 10px 35px;
color:Black;
background-color:Gray;
opacity:0.5;
border-width:medium;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-o-border-radius:20px;
border-radius:20px;
behavior:url(PIE.htc);
}

div.infooter
{
float:right;
width:70px;
margin-left:40%;
margin-right:40%;
/* background-color:Wheat;*/
}
div.inFooter:hover
{
border-radius:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-o-border-radius:20px;
behavior:url(PIE.htc);
background-color:Wheat;
-moz-transition:all 0.7s ease-in-out;
-o-transition:all 0.7s ease-in-out;
-webkit-transition:all 0.7s ease-in-out;
transition:all 0.7s ease-in-out;
behavior:url(PIE.htc);

}

div.downFooter
{
height:5%;
}

#nav
{
list-style-type:none;
float:right;
padding:42px 0 0 30px;
margin-top:0;
margin-bottom:10px;
margin-right:25px;
/* font-family:Tahoma;
font-size:20px;*/

}
#nav li
{

font-size:14px;
float:left;
/* font-family:Tahoma;*/
margin:0 10px 15px 10px;
}
#nav li a
{
text-decoration:none;
font-size:18px;
padding:5px 15px;
width:915px;
font-weight:bold;
color:#ccc;
border-radius:14px;
-webkit-border-radius:14px;
-o-border-radius:14px;
-moz-border-radius:14px;
border-width:4px;
font-family:B Mitra;
/* background-image:url('../Images/n/2.png'); */
border-color:White;
-moz-transition:all 0.6s ease-in-out;
-webkit-transition:all 056s ease-in-out;
-o-transition:all 0.6s ease-in-out;
transition:all 0.6s ease-in-out;
behavior:url(PIE.htc);

}

#nav li a:hover
{
font-size:24px;
color:Black;
background-color:Gray;
opacity:0.5;
border-width:medium;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-o-border-radius:20px;
border-radius:20px;
/*-moz-transition:all 0.7s ease-in-out;*/
-moz-transition:all 0.6s ease-in-out;
-webkit-transition:all 0.5s ease-in-out;
-o-transition:all 0.6s ease-in-out;
transition:all 0.6s ease-in-out;
behavior:url(PIE.htc);
}

.imgHolder
{
opacity:0.5;
transition:opacity 0.2s ease-out 0.3s;
-moz-transition:opacity 0.2s ease-out 0.1s;
-webkit-transition:opacity 0.2s ease-out 0.1s;
-o-transition:opacity 0.2s ease-out 0.1s;
behavior:url(PIE.htc);

}

.imgHolder:hover
{
opacity:1;
cursor:pointer;
behavior:url(PIE.htc);
}

زینب فاطمی
سه شنبه 09 آبان 1391, 23:00 عصر
سلام
این لینک رو ببینید :
http://weblog.corelist.net/category/webdesign/

طبیب دل
چهارشنبه 10 آبان 1391, 09:13 صبح
سلام
این لینک رو ببینید :
http://weblog.corelist.net/category/webdesign/
خیلی ممنون این لینک رو مطالعه کردم ولی چیزی که کارم راه بندازه متوجه نشدم

زینب فاطمی
چهارشنبه 10 آبان 1391, 13:49 عصر
برای تاثیر opacity در مرورگر IE باید از هک زیر استفاده کنید :
-ms-filter: "progid:DXImageTransform.Microsoft. »
Alpha(Opacity=100)"; /* IE 8 hack */
filter: alpha(opacity = 100); /* IE 5-7 hack */

براي مثال براي تاثیر دادن کدهاي بالا در IE باید استایل را بصورت زیر نوشت :
#use-opacity img{
opacity : 0.5; /* درصد روشنتر شود 50 */
-ms-filter: "progid:DXImageTransform.Microsoft. »
Alpha(Opacity=50)"; /* IE 8 hack */
filter: alpha(opacity = 50); /* IE 5-7 hack */
}
#use-opacity img:hover{
opacity : 1.0; /* کامل روشن شود */
-ms-filter: "progid:DXImageTransform.Microsoft. »
Alpha(Opacity=100)"; /* IE 8 hack */
filter: alpha(opacity = 100); /* IE 5-7 hack */
}