PDA

توجه ! این یک نسخه آرشیو شده میباشد و در این حالت شما عکسی را مشاهده نمیکنید برای مشاهده کامل متن و عکسها بر روی لینک مقابل کلیک کنید : کار نکردن دستور z-index برای دو div



<?php?>
July 4th, 2015, 14:09
سلام . من میخوام همچین چیزی بسازم :

http://www.webhostingtalk.ir/attachment.php?attachmentid=27007&stc=1


<body>
<div class="box1"></div>
<div class="box2"></div>
</body>





.box1{
width:700px;
height:100px;
background-color:red;
box-shadow: 0 10px 2px 0 black;
z-index:2;
}
.box2{
width:700px;
height:100px;
background-color:green;
z-index:1;
}


طبق دستور بالا ما دوتا Box داریم - box1 بالای box2 هستش . من به box1 خاصیت box-shadow میدم و براش یک سایه ایجاد میکنم - ولی میخوام سایه رویه box 2 قرار بگیره نه زیرش - سایه ای که با خاصیت box-shadow زدم رفته زیر box2 که من میخوام بیفته روش - برای همین به box1 خاصیت z-index میدم تا بالا تر قرار بگیره اما عمل نمیکنه ؟ چرا ؟

میخوام سایه ای که برای box1 میزنم رویه box2 قرار بگیره نه بره زیرش - چه کنم دوستان ؟ خیلی ممنون

PersianSkyTeam
July 4th, 2015, 14:12
سلام

خط زیر رو تو .box 2 اضافه کن :


box-shadow: 0 10px 2px 0 black;


یا کد رو به این شکل بزار :



<body>
<div class="box1">
<div class="box2"></div></div>
</body>

<?php?>
July 4th, 2015, 14:22
سلام

خط زیر رو تو .box 2 اضافه کن :


box-shadow: 0 10px 2px 0 black;


یا کد رو به این شکل بزار :



<body>
<div class="box1">
<div class="box2"></div></div>
</body>


ممنونولی جواب نمیده اینم . با دادن خاصیت box-shadow به box2 بد جور در میاد . به این عکس نگاه کنید متوجه منظورم قشنگ میشید :
http://www.webhostingtalk.ir/attachment.php?attachmentid=27006&stc=1

PersianSkyTeam
July 4th, 2015, 14:49
این کد رو تست کن :


<button id="AdvancedButton1" type="submit" name="box1" value="" style="position:absolute;left:97px;top:218px;width:311px; height:70px;z-index:0;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box1</span></div></button>
<button id="AdvancedButton2" type="button" name="" value="" style="position:absolute;left:97px;top:288px;width:311px; height:64px;z-index:1;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box2</span></div></button>

</body>

<?php?>
July 4th, 2015, 14:53
این کد رو تست کن :


<button id="AdvancedButton1" type="submit" name="box1" value="" style="position:absolute;left:97px;top:218px;width:311px; height:70px;z-index:0;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box1</span></div></button>
<button id="AdvancedButton2" type="button" name="" value="" style="position:absolute;left:97px;top:288px;width:311px; height:64px;z-index:1;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box2</span></div></button>

</body>

نشد بازم .

PersianSkyTeam
July 4th, 2015, 15:20
اینو تست کنید :





#box1
{
color: #000000;
font-family: Arial;
font-size: 13px;
-moz-box-shadow: 0px 0px 13px #000000;
-webkit-box-shadow: 0px 0px 13px #000000;
box-shadow: 0px 0px 13px #000000;
}
#box2
{
color: #000000;
font-family: Arial;
font-size: 13px;
}





کد :




<input type="submit" id="box1" name="" value="box1" style="position:absolute;left:109px;top:179px;width:213px ;height:51px;z-index:1;">
<input type="submit" id="box2" name="" value="box2" style="position:absolute;left:109px;top:230px;width:213px ;height:51px;z-index:2;">

<?php?>
July 4th, 2015, 15:37
بازم نشده - من با تگ های input کاری ندارم - من میخوام از تگ های div استفاده کنم .

PersianSkyTeam
July 4th, 2015, 15:42
دوست عزیز css دکمه ها رو به این شکل بزار :




.box1
{
color: #000000;
font-family: Arial;
font-size: 13px;
-moz-box-shadow: 0px 0px 13px #000000;
-webkit-box-shadow: 0px 0px 13px #000000;
box-shadow: 0px 0px 13px #000000;
}
.box2
{
color: #000000;
font-family: Arial;
font-size: 13px;
}



از هر کدی هم که خواستی استفاده کن.این Css اون چیزی هست که لازم دارید.

<?php?>
July 4th, 2015, 16:05
بازم اون چیزی که میخواستم نشد و هنوز سایه میره زیر . ازتون ممنونم که مدام کمکم میکنید . تشکر

PersianSkyTeam
July 4th, 2015, 16:10
خواهش میکنم.


نگاه کنید این مشکل واسه کد ها هست :




<body>
<div class="box1"></div>
<div class="box2"></div>
</body>


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

<?php?>
July 4th, 2015, 16:20
احتمالا به خاطر کد های Html هست . اما هر طوری زدم بازم نمیشه .

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

jahromweb
July 4th, 2015, 16:31
احتمالا به خاطر کد های Html هست . اما هر طوری زدم بازم نمیشه .

از دوستان اگه کسی بلده این عکسو درست کنه کدشو ده ما بفهمیم چه طور میسازنش . ممنون
سلام
این دو تا کد رو جدا تست کنید ببینید تغییر میکنه یا نه:
position:relative
position:absolute

PersianSkyTeam
July 4th, 2015, 16:31
این فایل رو دانلود کن.

27010

mojtaba05
July 4th, 2015, 17:36
با سلام
به div اولی position: relative بدید، درست میشه.