Skip to content

知乎简洁效果 Zhihu Clean by gembeta000

Screenshot of 知乎简洁效果 Zhihu Clean

Details

Authorgembeta000

LicenseNo License

Categoryzhihu, 知乎, zhihu.com,

Created

Updated

Code size2.6 kB

Code checksum5d62cde9

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

知乎首页搜索引擎样式。保留了头像入口。因为个人需要才制作,随缘更新。个人不是专业开发者,目前就是尽量能用就行。在 2K 屏尺寸上可以正常居中显示,在 1080p 屏幕上 Logo 和搜索框都会偏下。

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name         知乎简洁效果 Zhihu Clean
@version      0.0.3
@namespace    userstyles.world/user/gembeta000
@description  清理知乎首页。能用就行。首页仅保留知乎 Logo、顶部 Banner 的头像入口。没弄掉搜索框热搜榜,可以自行使用广告屏蔽类工具隐藏。
@author       gembeta000
@license      No License
==/UserStyle== */

@-moz-document url("https://www.zhihu.com/"){
    /*清除顶栏「首页」、「知乎知学堂」、「等你来答」、「知乎直达」按钮*/
    #root > div > div:nth-child(2) > header > div.AppHeader-inner.css-11p8nt5 > ul{
        display:none !important;
    }
    /*清除顶栏顶端闪个不停的加载条*/
    #root > div > div.LoadingBar.css-15mhxxt{
        display:none !important;
    }
    /*清除整个主页*/
    #root > div > main > div > div.Topstory-container{
        display:none !important;
    }
    #root > div > div:nth-child(2) > header > div:nth-child(2) > div{
        display:none !important;
    }
    /*清除搜索框 Placeholder*/
	input::placeholder{
		color: #f5f5f5 !important;
	}
    /*清除点击搜索框后跳出的热搜*/
    Popover1-content > div.Menu.AutoComplete-menu.SearchBar-menu.SearchBar-noValueMenu{
        display:none !important;
    }
}

@-moz-document url("https://www.zhihu.com/"){
    /*主区域修正,使顶栏的知乎 Logo 和搜索框能有更大的移动空间*/
	header.Sticky{
		height: 100vh! important;
	}
    /*隐藏的分隔结构*/
	.css-tfoxxs{
		position: unset !important;
		flex: unset !important;
	}
	.css-1xgntgp{
		flex: unset !important;        
	}
    /*顶栏定位*/
    #root > div > div:nth-child(2) > header{
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        display: flex;
        position: relative;
    }
    #root > div > div:nth-child(2) > header > div.AppHeader-inner.css-11p8nt5{
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        display: flex;
        position: relative;
    }
    /*知乎logo调整*/
	#root > div > div:nth-child(2) > header > div.AppHeader-inner.css-11p8nt5 > a > svg{
		height: 200px;
		width: 250px;
        position: absolute;
        top: 350%;
        left: 40%;
	}
    /*搜索框移动*/
    .SearchBar-tool{
        height: 200%;
        overflow: hidden;
        width: 150%;
        z-index: 200;
        margin: auto;
		left: 25%;
		top: 1070%;
    }
    .css-10fy1q8{
        max-width: 600px;
        max-height: 200px;
    }
}

Reviews

No reviews yet.