khateratean
چهارشنبه 04 دی 1392, 14:06 عصر
علاوه بر خاصیت overflow می توانید از خاصیت resize برای سرریز محتوی استفاده کنید.
با استفاده از خاصیت resize می توانید مشخص کنید که اندازه عنصر توسط کاربر قابل تغییر باشد یا خیر.
می توانید قابلیت تغییر اندازه عنصر را به سه صورت عمودی (vertical)، افقی (horizontal) و هر دو حالت (both) محدود کنید.
<!DOCTYPE html>
<html>
<head>
<style>
li
{
padding:10px 40px;
resize:both;
overflow:hidden;
height:30px;
}
</style>
</head>
<body>
<ul>
<li>
The resize property specifies whether or not an element is resizable by the user.
The resize property specifies whether or not an element is resizable by the user.
</li>
<li>
The resize property specifies whether or not an element is resizable by the user.
The resize property specifies whether or not an element is resizable by the user.
The resize property specifies whether or not an element is resizable by the user.
</li>
<li>
The resize property specifies whether or not an element is resizable by the user.
The resize property specifies whether or not an element is resizable by the user.
The resize property specifies whether or not an element is resizable by the user.
The resize property specifies whether or not an element is resizable by the user.
</li>
</ul>
<p><b>Note:</b> Internet Explorer and Opera do not support the resize property.</p>
</body>
</html>
خروجی کد بالا: http://beyamooz.com/try_it_yourself/tryit.php?filename=trycss3_resize
جهت مطالعه بیشتر در باره خصوصیت resize به لینک زیر مراجعه کنید:
http://beyamooz.com/css3/659-%D8%B1%D8%A7%D8%A8%D8%B7-%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%DB%8C-%D8%AF%D8%B1-css3
اگر مایل هستید به مثال زیر نیز نگاهی بیاندازید: (خاصیت overflow)
چگونه با لبريز شدن (overflow) يک عنصر برخورد کنيم (http://beyamooz.com/try_it_yourself/tryit.php?filename=trycss_overflow)
اين مثال نشان مي دهد که چگونه خصوصيت overflow را براي ايجاد يک scroll bar تنظيم کنيم(براي زماني که محتواي يک عنصر خيلي بزرگ است)
چگونه تنظيم کنيم که مرورگر به صورت اتوماتيک با overflow برخورد کند (http://beyamooz.com/try_it_yourself/tryit.php?filename=trycss_pos_overflow_auto)
اين مثال نشان مي دهد که چگونه مرورگر را تنظيم کنيم تا به صورت اتوماتيک با overflow برخورد کند.
منبع از سایت بیاموز (http://www.beyamooz.com)