صفت overflow در CSS
یادگیری CSS
                        تعداد بازدید :
                        
                            7208
                        
                    
                    
                        تاریخ و ساعت انتشار :
                        
                            چهار شنبه 1 شهریور 1396   01:53
                        
                    
                - زماني كه براي محتوايي محدوده اي تعيين ميكنيم ، اگر محتوا از اين محدوده به علت زياد بودن يا بزرگ بودن ، خارج نشود از صفت overflow براي عدم نمايش باقي مانده محتوا يا اضافه كردن نوار اسكرول به آن استفاده مي كنيم.
 
 صفت overflow يكي از 4 مقدار زير را مي تواند داشته باشد :
 
 visible : محتواي بيشتر از محدوده قطع نمي شود و خارج از محوطه محتوا ادامه مي يابد.
 hidden : باقيمانده محتوا نمايش داده نمي شود و محتواي موجود در محدوده تعيين شده نمايش داده مي شود.
 scroll : باقي مانده نمايش داده نمي شود اما يك نوار اسكرول براي نمايش باقي مانده ، زير آن ايجاد مي شود.
 auto : بسته به شرايط صفحه و مرورگر ، شايد يك نوار اسكرول براي نمايش باقي مانده محتوا ، ايجاد شود.
 
 نكته ! صفت overflow فقط در عناصر سطح بلوك كه ارتفاع مشخصي دارند ، كار مي كند.
 نكته ! در OS X Lion سيستم عامل Mac ، نوار اسكرول فقط زماني كه استفاده شوند نمايان مي شوند.
 
 Visibleبطور پيش فرض مقدار visible در صفت overflow مشخص مي كند كه محتوا قطع نشود و باقي آن از محوطه تعيين شده بيرون ميزند :
 
 مثال :
 صفت overflow با مقدار visible
 مشاهده مثالdiv { width: 200px; height: 50px; background-color: #eee; overflow: visible; }
 Hiddenمقدار hidden مشخص مي كند كه محتوا قطع شود و باقي مانده محتوا مخفي بماند.
 
 مثال :
 صفت overflow با مقدار hidden
 مشاهده مثالdiv { overflow: hidden; }
 Scrollمقدار scroll مشخص مي كند كه محتوا در داخل محدوده تعيين شده نمايش داده شود و يك نوار اسكرول به جعبه متن اضافه مي شود تا باقي مانده آن قابل دسترسي باشد. به ياد داشته باشيد كه در اين حالت نوار اسكرول هم عمودي و هم افقي ايجاد مي شود ، حتي اگر به آن نياز نداشته باشيد.
 
 مثال :
 صفت overflow با مقدار scroll
 مشاهده مثالdiv { overflow: scroll; }
 Autoمقدار auto همانند scroll است با اين تفاوت كه نوار اسكرول فقط به هنگام نياز اضافه مي شود.
 
 مثال :
 صفت overflow با مقدار auto
 مشاهده مثالdiv { overflow: auto; }
 overflow-x و overflow-yاين دو صفت زماني مورد استفاده است كه بخواهيم ديد افقي يا عمودي باقي مانده محتوا را تنظيم كنيم.
 
 مثال :
 دید افقی و عمودی
 مشاهده مثالdiv { overflow-x: hidden; /* Hide horizontal scrollbar */ overflow-y: scroll; /* Add vertical scrollbar */ }
 
         
                 ورود به کارتابل مشتریان وب مهراز
                    ورود به کارتابل مشتریان وب مهراز
                 
         
                     
             
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                     
                     
                     
                     
                     
                    
نظر شما
>