سلام دوستان
این ری اکت لعنتی چرا مثه ادم بکگرااند نمی گیره هر روشی رو امتحان کردم
ارور هم نمیده تو devtools همه چی درسته تصویر لود شده المنت درسته
با تک img تست کردم
با تگ div هم تست کردم
فقطو فقط با تگ body شد
اونم من میخوام به بکگراند بلور بدم
اگه میشه کد هاتونو قرار بدید
@mmj.sys
باید
background-repeat:no-repeat;
background-size:cover:
که هم تکرار نشه هم همه ی صفحه رو بگیره
فیکس صفحه باشه یا فیت؟
اگه فیکس میخوای باشه
position:fixed;
اسفتاده کن
سلام وقت بخیر
مشکلی با style نداره
دو نوع استایل خدمت شما خدمت شما
<div style={{ backgroundColor: "red" }}>hello</div>
و به این صورت
const styles = {
backgroundColor: "red"
}
export default function App() {
return (
<>
<div style={styles}>hello</div>
</>
);
}
سلام ممنونم از پاسختون
اما من میخوام تصویرم رو کل صفحه باشه مشکلم استایل المنت نیست
وقتی رو body اعمال کنم میشه اما میخوام بگکراندم بلور باشه برا همین نمیشه روی body اعمالش کرد
اگر روی روی المنت دیگه ای هم باشه باعث میشه عکس تمام صفحه نشه
@mmj.sys
بله درسته شما برای این کار هم میتونین برای مثال از یک div جدا توی صفحه استفاده کنین برای مثال با این style
<div style={{ position: "relative",zIndex:10 }}>
hello
</div>
<div
style={{
zIndex:0,
backgroundColor: "red",
filter: "blur(50px)",
position: "absolute",
top: 0,
left: 0,
width: "100%",
height: "100%"
}}
></div>
هم میتونین نسبت به با از after یا before استفاده کنین که برای مثال اگر overlay میخواین بدین خیلی بهتره و پیشنهاد من after یا before هستش
اگر هم نه کلا میخواین یه کاره دیگه انجام بدین دقیق تر بگین میخواین چیکار کنین تا بتونم بیشتر راهنمایی کنم
بلور دادن به بک گراند امکان پذیر نیست دوست عزیز
بلور شدن فقط میشه به تگ ها و به عکس داد
به بک گراند نمیشه بلور داد
مگر اینکه برای اون المنت یک before ایجاد کنین
اونو ابسولوت کنین و توی کل کادر مورد نظرتون بکشید
بعد اون بیفور را بلور کنین
import './App.css';
function App() {
return (
<div>
<div className="header">
<h1 className="h1">title</h1>
</div>
<div
style={{
zIndex:-1,
backgroundImage: "url('http://localhost:8080/rand')",
filter: "blur(10px)",
position: "absolute",
top: 0,
left: 0,
width: "100%",
height: "100%"
}}
></div>
</div>
);
}
export default App;
الان این کد به من بلور بکگراند رو میده
اما میخوام
repeat نداشته باشه و فیکس صفحه باشه
سلام
من اصلا ری اکت کار نکردم و بیشتر بک اند کار هستم . اما احتمال میدم این موضوع مشابه css باشه . پس بهتره مقدار background-repeat:no-repeat;
رو بهش بدید . حالا هر جوری که باید تو ری اکت نوشته بشه .
@mmj.sys
باید
background-repeat:no-repeat;
background-size:cover:
که هم تکرار نشه هم همه ی صفحه رو بگیره
فیکس صفحه باشه یا فیت؟
اگه فیکس میخوای باشه
position:fixed;
اسفتاده کن
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟