کم نور کردن یا تاریک کردن تگ سایت
سلام و خسته نباشید
این عکس رو نگا کنید :
من میخوام مانند این عکس وقتی منو سایتم باز میشه منو روشن باشه ولی بقیه سایت کم نوز تر از خود منو باشن ... چطوری میتونم این کارو بکنم ؟
پاسخ‌ها
6
سلام وقت بخیر ،
خیلی ساده واستون توضیح میدم ، موقعی که منو باز میشه شما باید یک بکراند مشکی در حالت فیکس بندازی روی body که کل سایت رو پوشش بده فقط توجه داشته باش باید opacity بک گراند مشکی رو کم کنی که شبیه عکست بشه و به منو z-index با مقدار ۱ رو بده
سلام اقا فرشید @eniack من طبق کارهایی که شما گفتید عمل کردم ولی الان یک مشکلی هست .... opacity منو هم مثل body برابر 0.5 قرار میگیره با اینکه z-index رو مساوی ۱ قرار میدم ولی باز مشکل پا برجاست
اینم کدم هست
قسمت css
body{
opacity: 0.5;
margin:0;
direction:rtl;
font-family:tahoma;
}
ul{
padding:0;
margin:0;
list-style-type:none;
background-color:#333333;
overflow: hidden;
position:fixed;
width:100%;
top:0;
}
li {
float:right;
}
li a{
display:block;
text-decoration:none;
padding:10px;
color:#fff;
}
li a:hover{
background-color:#5db616;
}
.MyContent{
padding:10px;
text-align:center;
position:relative;
z-index:999999;
}
قسمت html
<body>
<ul>
<li><a href="#">خانه</a></li>
<li><a href="#">آموزش HTML</a></li>
<li><a href="#">آموزش CSS</a></li>
<li><a href="#">درباره ما</a></li>
</ul>
<br>
<br>
<div class="MyContent">
<!-- <h2 style="color:blue;">سایت آموزشی فری لرن</h2> -->
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<!-- <img src="img/logo.png"> -->
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
<p>سلام خوبی؟ این یک متن الکی برای پرکردن این قسمت می باشد.</p>
</div>
</body>لطفا بهم بگید که چطوری میتونم opacity:0.5 رو فقط برای body اعمال کنم نه برای منو
</body>
گفتگوهای مرتبط
شاید پاسخ شما همین‌جا باشد
سلام
oapacity
رو به بادی نده به بیفور یا افترش بده
راستش نفهمیدم منظورتون رو یعنی چی بی فور یا افترش بدم ؟؟ دقیق تر توضیح میدید ؟ ممنون @mohammadphp
یه بیفور یا افتر درست کن واس بادی و به اون opacity بده دیسپلیش رو در حال عادی none بزار و در حالتی که منو بازه block کن
سلام و وقت بخیر
کافیه این کد هارو اضافه کنی به فایل سی اس اس
body::before {
content: " ";
position: absolute;
display: block;
width: 100%;
height: 100%;
top:0;
right:0;
z-index: 2;
color: #000;
opacity: .5;
}دقت کنید z-index رو یکی کمتر از z-index منو قرار بدید
این یک لایه شفاف در ابتدای تگ بادی اضافه میکنه با تنظیم display این لایه میتونید مخفیش کنید یا نمایشش بدید (همونطور که دوستان گفتن موقع باز شدن منو مقدار block و موقع بسته شدن مقدار none)
فقط تستش نتونستم بکنم اگر استفاده کردید و کار نکرد