.scroll-container {width: 500px;height: 150px;border: 1px solid #ddd;padding: 15px;overflow: auto; /*必須*/}.scroll-container::-webkit-scrollbar {width: 8px;background: white;}.scroll-container::-webkit-scrollbar-corner,/* 滾動條角落 */.scroll-container::-webkit-scrollbar-thumb,.scroll-container::-webkit-scrollbar-track { /*滾動條的軌道*/border-radius: 4px;}.scroll-container::-webkit-scrollbar-corner,.scroll-container::-webkit-scrollbar-track {/* 滾動條軌道背景 */background-color: rgba(180, 160, 120, 0.1);box-shadow: inset 0 0 1px rgba(180, 160, 120, 0.5);}.scroll-container::-webkit-scrollbar-thumb {/* 滾動條里面的小滾動條 */background-color: #00adb5;}

html

<p class="scroll-container">庭院深深，不知有多深？楊柳依依，飛揚起片片煙霧，一重重簾幕不知有多少層。豪華的車馬停在貴族公子尋歡作樂的地方，她登樓向遠處望去，卻看不見那通向章臺的大路。春已至暮，三月的雨伴隨著狂風大作，再是重門將黃昏景色掩閉，也無法留住春意。淚眼汪汪問落花可知道我的心意，落花默默不語，紛亂的，零零落落一點一點飛到秋千外。庭院深深，不知有多深？楊柳依依，飛揚起片片煙霧，一重重簾幕不知有多少層。豪華的車馬停在貴族公子尋歡作樂的地方，她登樓向遠處望去，卻看不見那通向章臺的大路。春已至暮，三月的雨伴隨著狂風大作，再是重門將黃昏景色掩閉，也無法留住春意。淚眼汪汪問落花可知道我的心意，落花默默不語，紛亂的，零零落落一點一點飛到秋千外。庭院深深，不知有多深？楊柳依依，飛揚起片片煙霧，一重重簾幕不知有多少層。豪華的車馬停在貴族公子尋歡作樂的地方，她登樓向遠處望去，卻看不見那通向章臺的大路。春已至暮，三月的雨伴隨著狂風大作，再是重門將黃昏景色掩閉，也無法留住春意。淚眼汪汪問落花可知道我的心意，落花默默不語，紛亂的，零零落落一點一點飛到秋千外。庭院深深，不知有多深？楊柳依依，飛揚起片片煙霧，一重重簾幕不知有多少層。豪華的車馬停在貴族公子尋歡作樂的地方，她登樓向遠處望去，卻看不見那通向章臺的大路。春已至暮，三月的雨伴隨著狂風大作，再是重門將黃昏景色掩閉，也無法留住春意。淚眼汪汪問落花可知道我的心意，落花默默不語，紛亂的，零零落落一點一點飛到秋千外。 </p>

制作三角形

.up-triangle {width: 0;height: 0;border-style: solid;border-width: 0 25px 40px 25px;border-color: transparent transparent rgb(245, 129, 127) transparent;}/* 倒三角 */.down-triangle {width: 0;height: 0;border-style: solid;border-width: 40px 25px 0 25px;border-color: rgb(245, 129, 127) transparent transparent transparent;}

html

<div class="up-triangle"></div> <div class="down-triangle"></div>

總結

以上是生活随笔為你收集整理的隐藏滚动条或更改滚动条样式加制作三角形的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。