کانتینر عکس و متن/عطاری حافظ - فراغیب
Esfandiari (بحث | مشارکتها) صفحهای تازه حاوی «<html> <!-- کانتینر اصلی با طراحی ریسپانسیو و سایه ملایم --> <div style="margin: 15px auto; padding: 15px; direction: rtl; text-align: right; background-color: #ffffff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); max-width: 1000px; box-sizing: border-box;"> <!-- ایجاد چیدمان انعطافپذیر (Flexbox...» ایجاد کرد |
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
||
| (۳ نسخهٔ میانیِ ایجادشده توسط همین کاربر نشان داده نشد) | |||
| خط ۱: | خط ۱: | ||
<html> | <html> | ||
<head> | |||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||
<style> | |||
@media (max-width: 768px) { | |||
.main-wrap { | |||
padding: 12px !important; | |||
margin: 10px auto !important; | |||
} | |||
.main-flex { | |||
flex-direction: column !important; | |||
gap: 15px !important; | |||
} | |||
.image-box { | |||
flex: 1 1 100% !important; | |||
max-width: 100% !important; | |||
} | |||
.image-box img { | |||
width: 100% !important; | |||
max-width: 300px !important; | |||
height: auto !important; | |||
display: block; | |||
margin: 0 auto; | |||
} | |||
.text-wrap { | |||
width: 100% !important; | |||
max-width: 100% !important; | |||
padding: 10px !important; | |||
box-sizing: border-box; | |||
} | |||
.text-box { | |||
flex: 1 1 100% !important; | |||
min-width: auto !important; | |||
padding: 0 !important; | |||
} | |||
} | |||
</style> | |||
</head> | |||
<body> | |||
<!-- کانتینر اصلی با طراحی ریسپانسیو و سایه ملایم --> | <!-- کانتینر اصلی با طراحی ریسپانسیو و سایه ملایم --> | ||
<div style="margin: 15px auto; padding: 15px; direction: rtl; text-align: | <div class="main-wrap" style="margin: 15px auto; padding: 15px; direction: rtl; text-align: justify; | ||
background-color: #ffffff; border: 1px solid #e2e8f0; border-radius: 12px; | background-color: #ffffff; border: 1px solid #e2e8f0; border-radius: 12px; | ||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); max-width: 1000px; box-sizing: border-box;"> | box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); max-width: 1000px; width: 100%; box-sizing: border-box;"> | ||
<!-- ایجاد چیدمان انعطافپذیر (Flexbox) با قابلیت شکستن خط در موبایل --> | <!-- ایجاد چیدمان انعطافپذیر (Flexbox) با قابلیت شکستن خط در موبایل --> | ||
<div style="display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: center;"> | <div class="main-flex" style="display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: center;"> | ||
<!-- بخش تصویر (در دسکتاپ عرض مشخص دارد و در موبایل وسطچین و متناسب میشود) --> | <!-- بخش تصویر (در دسکتاپ عرض مشخص دارد و در موبایل وسطچین و متناسب میشود) --> | ||
<div style="flex: 1 1 30%; max-width: 300px; text-align: center; margin: 0 auto;"> | <div class="image-box" style="flex: 1 1 30%; max-width: 300px; text-align: center; margin: 0 auto;"> | ||
<div style="border-radius: 15px; overflow: hidden;"> | <div style="border-radius: 15px; overflow: hidden;"> | ||
<!--https://dl.faraghaib.ir/m/103/gap.png نمونه آدرس دهی--> | <!--https://dl.faraghaib.ir/m/103/gap.png نمونه آدرس دهی--> | ||
<img src="https://dl.faraghaib.ir/m/105/2.jpg" style="width:300px;height: | <img src="https://dl.faraghaib.ir/m/105/2.jpg" alt="عطاری و ادویه سرای حافظ" style="width:100%; max-width:300px; height:auto;"> | ||
</div> | </div> | ||
</div> | </div> | ||
<div style="width: 600px;margin: 1px auto; padding: 5px; direction: rtl; text-align: right; | <div class="text-wrap" style="width: 600px; max-width: 100%; margin: 1px auto; padding: 5px; direction: rtl; text-align: right; | ||
background-color: #ffffff; border: 1px solid #89CFF0; border-radius: 12px; box-sizing: border-box;"> | |||
<!-- بخش متن (در دسکتاپ عرض بیشتر را میگیرد و در موبایل تمامعرض میشود) --> | |||
<div class="text-box" style="flex: 2 1 70%; min-width: 280px; padding: 5px;"> | |||
<div style="font-size: 1em; line-height: 1.8; color: #2d3748; direction: rtl; text-align: justify;"> | |||
برای داشتن یک آشپزی حرفهای و طعمهای ماندگار، کیفیت ادویه حرف اول را میزند؛ محصولات تضمینشده <strong>عطاری و ادویه سرای حافظ</strong> بهترین انتخاب برای عطر و رنگ سفره شماست. همچنین برای تهیه محصولات ارگانیک و بهرهمندی از خواص شفابخش طبیعت، میتوانید روی تخصص و کیفیت <strong>گیاهان دارویی کریم زایی</strong> حساب ویژهای باز کنید. با اطمینان از اصالت کالا، طعم اصیل و سلامتی را به خانه خود هدیه دهید. | |||
</div> | </div> | ||
</div> | |||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
</body> | |||
</html> | |||
نسخهٔ کنونی تا ۱۸ ژوئیهٔ ۲۰۲۶، ساعت ۰۶:۵۷
برای داشتن یک آشپزی حرفهای و طعمهای ماندگار، کیفیت ادویه حرف اول را میزند؛ محصولات تضمینشده عطاری و ادویه سرای حافظ بهترین انتخاب برای عطر و رنگ سفره شماست. همچنین برای تهیه محصولات ارگانیک و بهرهمندی از خواص شفابخش طبیعت، میتوانید روی تخصص و کیفیت گیاهان دارویی کریم زایی حساب ویژهای باز کنید. با اطمینان از اصالت کالا، طعم اصیل و سلامتی را به خانه خود هدیه دهید.