Wednesday, December 15, 2010

IE6-ийн css-ийн асуудал

уусалттай зургаар хийсэн background-тай  үед background-ийг нь доорх байдлаар тавьсан

background-repeat:no-repeat; background-image:url("assets/bg.png"); *background-image:none; *filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://localhost:8080/chart/static/style/interface/chart/default/assets/bg.png", sizingMethod='scale');

Асуудлууд:

  1. Ингэж тавьсан тохиолдолд IE6 дээр ийм background-тай tag-ууд доторх ямар ч <a> tag-ууд ажиллахгүй байна.
  2. Ингэж тавихгүй болохоор IE6 дээр уусалттай зураг бүхий background-аа авч чадахгүй байна.
Шийдэл ????

Шийдэл1:

Үүнийг шийдэх энгийн бөгөөд бага зэрэг болхи арга нь дан ганц html болон css-ээр нь шийдэх.  Үүнийг хийхэд html нь дараах байдалтай байна.

<div class="bg-contr"></div>
<div class="content-contr">
    <a href="javascript:void(0)">Энд контентууд нь байна.</a>
</div>

харин css нь

.bg-contr{position:relative; background-repeat:no-repeat; background-image:url("assets/bg.png"); *background-image:none; *filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://localhost:8080/project/static/style/interface/site/default/assets/bg.png", sizingMethod='scale');}

.content-contr{position:absolute; top:0; left:0;}


Ингэснээр background-ийг агуулж байгаа таг болон тэр дотор харагдах контентыг агуулж байгаа тагууд нь хоорондоо хамааралгүй болж нэгийг нь нөгөө дээр нь давхарлаж тавьсан байдлаар харагдуулах боломжтой болж байна.


No comments:

Post a Comment