文章重點(diǎn)來介紹html+css配置wordpress主題在小屏幕的時(shí)候隱藏側(cè)邊欄的例子,有需要了解的朋友可進(jìn)入?yún)⒖?
看到標(biāo)題好長啊,對(duì)于一個(gè)響應(yīng)式web站點(diǎn)來說,很多功能都是通過 @media queries 和 Viewports 來實(shí)現(xiàn)哈,本站現(xiàn)在使用的也是html5的wordpress響應(yīng)式主題,當(dāng)然,還會(huì)有js來實(shí)現(xiàn)Responsive的,但本來就不了解這方面的知識(shí),所以也就不敢描述了.
使用本主題也算是有好一段時(shí)間了,在小屏幕訪問的時(shí)候,老是看見加載了wordpress頁面?zhèn)冗厵?就想把它棄掉,前段時(shí)間剛好看到了@media queries的一些東西,然后就打開主題的style.css文件看看,發(fā)現(xiàn)能改了.
下面是主題部分@media配置:

原來設(shè)置為,代碼如下:
- @media screen and (max-width: 768px) {
- //開源軟件:Vevb.com
- #content,
- #sidebar {
- float: left;
- padding: 2%;
- width: 96%;
- display:none;
- }
- }
下面是通過此法禁止效果:

新聞熱點(diǎn)
疑難解答
圖片精選