溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

html如何設(shè)置div橫向滾動條不顯示

發(fā)布時間:2022-01-18 17:16:10 來源:億速云 閱讀:1003 作者:iii 欄目:web開發(fā)

本文小編為大家詳細(xì)介紹“html如何設(shè)置div橫向滾動條不顯示”,內(nèi)容詳細(xì),步驟清晰,細(xì)節(jié)處理妥當(dāng),希望這篇“html如何設(shè)置div橫向滾動條不顯示”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學(xué)習(xí)新知識吧。

在html中,可以利用style和“overflow-x”屬性設(shè)置div橫向移動滾動條不顯示,當(dāng)屬性的值設(shè)置為“hidden”時,就會不提供橫向滾動機(jī)制,語法為“<div style="overflow-x:hidden">”。

本教程操作環(huán)境:windows10系統(tǒng)、HTML5版、Dell G3電腦。

html怎樣設(shè)置div橫向滾動條不顯示

overflow-x屬性指定如果它溢出了元素的內(nèi)容區(qū)是否剪輯左/右邊緣內(nèi)容。

語法為:

overflow-x: visible|hidden|scroll|auto|no-display|no-content;

其中參數(shù)表示如下:

html如何設(shè)置div橫向滾動條不顯示

示例如下:

<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指定是否要剪輯的左/右邊緣的內(nèi)容.</p>
<p>Overflow-y指定是否要剪輯的頂部/底部邊緣的內(nèi)容</p>
</body>
</html>

當(dāng)沒有給div元素添加style="overflow-x:hidden;"樣式時,輸出結(jié)果如下:

html如何設(shè)置div橫向滾動條不顯示

上述示例添加了該樣式,輸出結(jié)果如下:

html如何設(shè)置div橫向滾動條不顯示

html是什么

html的全稱為超文本標(biāo)記語言,它是一種標(biāo)記語言,包含了一系列標(biāo)簽.通過這些標(biāo)簽可以將網(wǎng)絡(luò)上的文檔格式統(tǒng)一,使分散的Internet資源連接為一個邏輯整體,html文本是由html命令組成的描述性文本,html命令可以說明文字,圖形、動畫、聲音、表格、鏈接等,主要和css+js配合使用并構(gòu)建優(yōu)雅的前端網(wǎng)頁。

讀到這里,這篇“html如何設(shè)置div橫向滾動條不顯示”文章已經(jīng)介紹完畢,想要掌握這篇文章的知識點(diǎn)還需要大家自己動手實踐使用過才能領(lǐng)會,如果想了解更多相關(guān)內(nèi)容的文章,歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI