”。
![html怎麼設定div橫向捲軸不顯示](https://img.php.cn/upload/article/202201/18/2022011814370729120.jpg)
本教學操作環境:windows10系統、HTML5版、Dell G3電腦。
html怎麼設定div橫向捲軸不顯示
overflow-x屬性指定如果它溢出了元素的內容區是否剪輯左/右邊緣內容。
語法為:
overflow-x: visible|hidden|scroll|auto|no-display|no-content;
其中參數表示如下:
![1642488495201335.png html怎麼設定div橫向捲軸不顯示](https://img.php.cn/upload/image/881/724/109/1642488495201335.png)
#範例如下:
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
div
{
width:110px;
height:110px;
border:thin solid black;
overflow-y:hidden;
}
</style>
</head>
<body>
<div style="overflow-x:hidden;"><p style="width:140px">
In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since.
'Whenever you feel like criticizing anyone,' he told me, 'just remember that all the people in this world haven't had the advantages that you've had.'
</p></div>
<p>Overflow-x指定是否要剪辑的左/右边缘的内容.</p>
<p>Overflow-y指定是否要剪辑的顶部/底部边缘的内容</p>
</body>
</html>
當沒有為div元素添加style="overflow-x:hidden;"樣式時,輸出結果如下:
![1642488585415221.png html怎麼設定div橫向捲軸不顯示](https://img.php.cn/upload/image/422/554/215/1642488585415221.png)
#上述範例新增了該樣式,輸出結果如下:
![1642488612791074.png html怎麼設定div橫向捲軸不顯示](https://img.php.cn/upload/image/404/592/661/1642488612791074.png)
推薦教學:《html影片教學》