صفحهٔ اصلی: تفاوت میان نسخهها
جزبدون خلاصۀ ویرایش برچسب: ویرایش مبدأ ۲۰۱۷ |
جزبدون خلاصۀ ویرایش برچسب: ویرایش مبدأ ۲۰۱۷ |
||
| خط ۴: | خط ۴: | ||
align-items: center; | align-items: center; | ||
margin: 0; | margin: 0; | ||
padding: | padding: 20px; | ||
min-height: 100vh; | |||
background-color: #f8ede7; | |||
"> | "> | ||
<div style=" | <div style=" | ||
display: flex; | display: flex; | ||
flex-direction: row; | |||
align-items: center; | align-items: center; | ||
background-color: | background-color: white; | ||
padding: 30px; | padding: 30px; | ||
border-radius: 15px; | border-radius: 15px; | ||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); | ||
max-width: 100%; | max-width: 100%; | ||
width: 800px; | |||
"> | "> | ||
<div style="flex: 1; padding: 15px;"> | <div style="flex: 1; padding: 15px; order: 1;"> | ||
<h1 style="color: #5D4037; margin-top: 0;">عنوان متن شما</h1> | <h1 style="color: #5D4037; margin-top: 0;">عنوان متن شما</h1> | ||
<p style="color: #3E2723; line-height: 1.6;">این یک متن نمونه است که در کنار تصویر قرار میگیرد. شما میتوانید این متن را با محتوای مورد نظر خود جایگزین کنید.</p> | <p style="color: #3E2723; line-height: 1.6;">این یک متن نمونه است که در کنار تصویر قرار میگیرد. شما میتوانید این متن را با محتوای مورد نظر خود جایگزین کنید.</p> | ||
</div> | </div> | ||
<div style="margin-left: 30px;"> | <div style="margin-left: 30px; order: 2; text-align: center;"> | ||
<img src="حوزه-مجازی-ضحی.png" alt="تصویر نمونه" style="max-width: 100%; height: auto; border-radius: 10px;"> | |||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
<style> | |||
@media (max-width: 768px) { | |||
div > div { | |||
flex-direction: column !important; | |||
padding: 20px !important; | |||
} | |||
div > div > div { | |||
margin-left: 0 !important; | |||
margin-bottom: 20px !important; | |||
order: 2 !important; | |||
width: 100% !important; | |||
} | |||
div > div > div:last-child { | |||
order: 1 !important; | |||
} | |||
} | |||
</style> | |||
----- | |||
<div style=" id="textContainer"> | <div style=" id="textContainer"> | ||