今天有點空閒,想起來上次有個qwebview的滾動條的style,一直都沒有實現,就用html5試了一下,
雖然不好看,也有好幾個功能還沒有實現,現在將自己寫的分享出來,大神勿噴,還望不吝賜教。
先看看一些滾動條設定的屬性:
1.overflow
: visible卻省值,沒有div滾動條,根據內容自動擴撐區域的大小,即定義的區域無效
scroll總是顯示滾動條
hidden沒有滾動條,超出區域的內容不可見
auto根據內容自動判斷是否新增滾動條
2.overflow-x:hidden;
/*隱藏底部的橫向滾動條*/
scrollbar-arrow-color
: #f4ae21;
/*三角箭頭的顏色*/
scrollbar-face-color
: #333;
/*立體滾動條的顏色*/
scrollbar-3dlight-color
: #666;
/*立體滾動條亮邊的顏色*/
scrollbar-highlight-color
: #666;
/*滾動條空白部分的顏色*/
scrollbar-shadow-color
: #999;
/*立體滾動條陰影的顏色*/
scrollbar-darkshadow-color
: #666;
/*滾動條強陰影顏色*/
scrollbar-track-color
: #666;
/*立體滾動條背景顏色*/
scrollbar-base-color
: #f8f8f8;
/*滾動條的基本顏色*/
3.overflow-xoverflow-y
visible卻省值,沒有div滾動條,根據內容自動擴撐區域的大小,即定義的區域無效
scroll總是顯示滾動條
hidden沒有div滾動條,超出區域的內容不可見
auto根據內容自動判斷是否新增滾動條
再上實際效果圖:
再來看看源**:
::-webkit-scrollbar
::-webkit-scrollbar-track
//滾動條的face style 和後面的槽
::-webkit-scrollbar-thumb
//不知道為什麼,這一行好像沒有用
::-webkit-scrollbar-thumb:hover
//滑鼠按下去後滾動條style
::-webkit-scrollbar-thumb:active
另外,附加乙份qlistwidget滾動條的style:
qlistwidget的滾動條的style可以直接在樣式表裡面設定,setstylesheet();函式設定他的樣式表。
// 設定垂直滾動條基本樣式
qscrollbar:vertical
qscrollbar::handle:vertical
qscrollbar::handle:vertical:hover
qscrollbar::add-line:vertical // 這個應該是設定下箭頭的,3.png就是箭頭
qscrollbar::sub-line:vertical // 設定上箭頭
qscrollbar::add-line:vertical:hover // 當滑鼠放到下箭頭上的時候
qscrollbar::sub-line:vertical:hover // 當滑鼠放到下箭頭上的時候
qscrollbar::add-page:vertical,qscrollbar::sub-page:vertical // 當滾動條滾動的時候,上面的部分和下面的部分
當然也可以用載入檔案的方式來設定滾動條的style。 QWebView設定html內容
qt5.2版本中sethtml格式無效 qstring qsdata testdata qstring qsurlpath d testpath qurl qurl qurl fromlocalfile qsurlpath ui webview sethtml qsdata,qurl ui webv...
HTML快取設定
pragma與no cache用於定義頁面快取,不快取頁面 為了提高速度一些瀏覽器會快取瀏覽者瀏覽過的頁面,通過下面的定義,瀏覽器一般不會快取頁面,而且瀏覽器無法離線瀏覽.常見的取值有private no cache max age must revalidate等,預設為private,其作用根據...
HTML 字型設定
針對font family屬性進行詳細設定,首先我們要了解,字型分類 有襯線字型 serif,一般用在段落處或者非標題部分 當我們設定字型的時候,設定順序應該是 example font family x y z san serif 系統如果找不到x,y,z字型,那麼會找本機上預設的san seri...