如何隐藏滚动条

学习如何使用 CSS 隐藏滚动条。

如何隐藏滚动条

添加 overflow: hidden;，可以同时隐藏水平和垂直滚动条。

ఉదాహరణ

body {
  overflow: hidden; /* స్క్రోల్‌బార్లను దాచి */
}

స్వయంగా ప్రయత్నించండి

పెరపెడు స్క్రోల్‌బార్‌ను లేదా అడుగున స్క్రోల్‌బార్‌ను దాచి కొన్ని ఉపయోగించడానికి క్రింది కోడ్‌ను ఉపయోగించవచ్చు: overflow-y లేదా overflow-x:

ఉదాహరణ

body {
  overflow-y: hidden; /* పెరపెడు స్క్రోల్‌బార్‌ను దాచి */
  overflow-x: hidden; /* అడుగున స్క్రోల్‌బార్‌ను దాచి */
}

స్వయంగా ప్రయత్నించండి

మీరు పరిగణించండి చేయండి కాని పదంoverflow:hidden స్క్రోల్‌బార్‌ను దాచి ఫంక్షన్‌ను తొలగిస్తుంది. పేజీలో స్క్రోల్‌ను చేరుకోలేము.

స్క్రోల్‌బార్‌ను దాచి ఫంక్షన్‌ను కాపాడటం

స్క్రోల్‌బార్‌ను దాచి కాని ఫంక్షన్‌ను కాపాడటానికి క్రింది కోడ్‌ను ఉపయోగించవచ్చు:

ఉదాహరణ

/* Chrome, Safari మరియు Opera కోసం స్క్రోల్‌బార్‌ను దాచి */
.example::-webkit-scrollbar {
  display: none;
}
/* IE, Edge మరియు Firefox కోసం స్క్రోల్‌బార్‌ను దాచి */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

స్వయంగా ప్రయత్నించండి

వెబ్కిట్ బ్రౌజర్లు (ఉదా. ఛోమ్, సఫారీ మరియు ఓపెరా) అసంబద్ధ మార్గాన్ని మద్దతు ఇస్తాయి ::-webkit-scrollbar ప్రతీయార్థి, మాకు బ్రౌజర్ స్క్రోల్‌బార్ రూపాన్ని మార్చడానికి అనుమతిస్తుంది. IE మరియు Edge ఇది మద్దతు ఇస్తాయి -ms-overflow-style: గుణం, ఫైర్‌ఫాక్స్ ఇది మద్దతు ఇస్తుంది scrollbar-width గుణాలు, ఈ గుణాలు మాకు స్క్రోల్‌బార్‌ను దాచి అది ఫంక్షన్‌ను కాపాడటానికి అనుమతిస్తాయి。

సంబంధిత పేజీలు

పాఠ్యక్రమం：CSS 溢出

参考手册：CSS overflow 属性