یک محتوا، سه رفتار متفاوت
در هر نمونه، عرض لینک 160px و ارتفاع آن 56px نوشته شده است. رفتار عرض و ارتفاع را مقایسه کنید.
حالت بلوکی • block
هر لینک از سطر تازه شروع می‌شود. عرض ثابت را حذف کنید تا فضای در دسترس را بگیرد.
حالت درون‌خطی • inline
لینک‌ها در جریان متن هستند؛ عرض و ارتفاع تعیین‌شده به این لینک‌های متنی اعمال نمی‌شوند.
حالت درون‌خطی با جعبه مستقل • inline-block
لینک‌ها کنار هم هستند، اندازه می‌پذیرند و اگر جا کم باشد به سطر بعد می‌روند.
تمرین شما
لینک‌های زیر را به جعبه‌هایی کنار هم تبدیل کنید؛ عرض 160px، حداقل ارتفاع 56px و فاصله بیرونی 4px. پاسخ در فایل solution.css است.
طراحی سایت
این بخش مقصد لینک نمونه است.
بهینه‌سازی سایت
این بخش مقصد لینک نمونه است.
آموزش طراحی وب
این بخش مقصد لینک نمونه است.
این پیام فقط برای آزمایش display: none نوشته شده است.