本篇文章給大家分享的是有關(guān)怎么使用overflow-x屬性，小編覺得挺實(shí)用的，因此分享給大家學(xué)習(xí)，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。

成都做網(wǎng)站、網(wǎng)站制作介紹好的網(wǎng)站是理念、設(shè)計(jì)和技術(shù)的結(jié)合。創(chuàng)新互聯(lián)擁有的網(wǎng)站設(shè)計(jì)理念、多方位的設(shè)計(jì)風(fēng)格、經(jīng)驗(yàn)豐富的設(shè)計(jì)團(tuán)隊(duì)。提供PC端+手機(jī)端網(wǎng)站建設(shè)，用營銷思維進(jìn)行網(wǎng)站設(shè)計(jì)、采用先進(jìn)技術(shù)開源代碼、注重用戶體驗(yàn)與SEO基礎(chǔ)，將技術(shù)與創(chuàng)意整合到網(wǎng)站之中，以契合客戶的方式做到創(chuàng)意性的視覺化效果。

  overflow-x屬性是用來指定當(dāng)元素溢出內(nèi)容區(qū)域時(shí)，是否對內(nèi)容的左/右邊緣進(jìn)行裁剪。

CSS3  overflow-x屬性

作用：overflow-x屬性規(guī)定是否對內(nèi)容的左/右邊緣進(jìn)行裁剪 - 如果溢出元素內(nèi)容區(qū)域的話。

提示：使用overflow-y屬性來判斷頂部和底部邊緣是否裁剪。

語法：

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

visible：不裁剪內(nèi)容，可能會(huì)顯示在內(nèi)容框之外。

hidden：裁剪內(nèi)容 - 不提供滾動(dòng)機(jī)制。

scroll：裁剪內(nèi)容 - 提供滾動(dòng)機(jī)制。

auto：如果溢出框，則應(yīng)該提供滾動(dòng)機(jī)制。

no-display：如果內(nèi)容不適合內(nèi)容框，則刪除整個(gè)框。

no-content：如果內(nèi)容不適合內(nèi)容框，則隱藏整個(gè)內(nèi)容。

注：overflow-x 屬性無法在 IE8 以及更早的瀏覽器正確地工作。

CSS3  overflow-x屬性的使用示例

這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。
這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。
這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。
這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。
這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。這是一個(gè)段落。


Overflow-x 是否對內(nèi)容的左/右邊緣進(jìn)行裁剪。
Overflow-y 是否對內(nèi)容的上/下邊緣進(jìn)行裁剪。

效果圖：

以上就是怎么使用overflow-x屬性，小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘９ぷ鲿?huì)見到或用到的。希望你能通過這篇文章學(xué)到更多知識(shí)。更多詳情敬請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。