HTML DOM style propriété overflow
style Objets Définition et utilisation
ensembles de propriétés de débordement ou retourne la façon de traiter avec les éléments présents dans le contenu de la boîte à l'extérieur.
grammaire
Définition des propriétés de débordement:
Object.style.overflow="visible|hidden|scroll|auto|inherit"
Retour propriétés de débordement:
Object.style.overflow
| 值 | 描述 |
|---|---|
| visible | 默认。内容不会被修剪，会显示在元素框之外。 |
| hidden | 内容会被修剪，元素框外面的内容不会被显示，浏览器不会显示滚动条。 |
| scroll | 浏览器会显示滚动条，如果需要内容会被修剪。 |
| auto | 内容会被修剪，如果需要则显示滚动条。 |
| inherit | overflow 属性的值从父元素继承。 |
support du navigateur
Tous les principaux navigateurs prennent en charge la propriété de débordement.
Note: IE7 et les versions antérieures ne supportent pas la valeur "inherit".IE8 ne fournit DOCTYPE! Supporté "inherit". soutien IE9 "inherit".
Trucs et astuces
Astuce: Si vous souhaitez masquer la barre de défilement du document entier, utilisez la propriété de débordement sur l'élément corporel ou html.
Exemples
Exemples
Utilisez la propriété de débordement pour cacher le contenu déborde:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<style type="text/css">
div{
border:1px solid red;
width:100px;
height:100px;
}
</style>
<script>
function displayResult(){
document.getElementById("div1").style.overflow="hidden";
}
</script>
</head>
<body>
<div id="div1">
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
</div>
<br>
<input type="button" onclick="displayResult()" value="隐藏溢出">
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<style type="text/css">
div{
border:1px solid red;
width:100px;
height:100px;
}
</style>
<script>
function displayResult(){
document.getElementById("div1").style.overflow="hidden";
}
</script>
</head>
<body>
<div id="div1">
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
这是一些文本。这是一些文本。
</div>
<br>
<input type="button" onclick="displayResult()" value="隐藏溢出">
</body>
</html>
Essayez »
style Objets