牛骨文教育服务平台(让学习变的简单)
博文笔记

如何去掉chrome浏览知乎时的大标题栏

创建时间:2018-01-27 投稿人: 浏览次数:131
1、chrome有一个叫做stylish插件,安装好之后查找一个叫做Simple_Zhihu的样式,真的超级好用,基本上是可以自定义网页的各个板块的颜色。下载安装好之后,打开知乎任意的一个页面,点击chrome右上角刚刚安装好的stylish图标,然后点击”为此网站查找更多样式“


2、从跳转到的网页中选取别人做好的主题样式,找到Simple_Zhihu,点击安装(我这个是已经安装过了,所以显示更新)



3、安装好之后,再次点击chrome中的stylish图标,选择 ”已安装的样式“,选择编辑。



4、点击去之后就能看到这个插件的配置代码,这个代码的注释是很详细的,都是一些简单的rgba的配色设置,自己摸索着就可以改动。

我贴一下我设置的地方,我加了注释。

body {
    background: #f5f5f5
}
/* 知乎相关信息 */

.Sticky .Footer {
    display: none
}
/* 建议 & 回到顶部 */
.CornerButtons {
    display: none
}
/* 头部导航栏 */

.AppHeader {
    background: none;
   /*background-color: #2693EC*/
}
.Avatar {
    border-radius: 150px
}
.AppHeader-inner {
    height: 46px
}
.AppHeader-userInfo {
    margin-top: 8px;
    margin-bottom: 7px
}
.Icon.Icon--logo {
    margin-top: 8px;
    margin-bottom: 8px;
    fill: rgba(0, 0, 0, 0) !important
}
.Icon.Icon--news {
    fill: rgb(255, 0, 0) !important
}
.Icon.Icon--message {
    fill: rgb(255, 0, 0) !important
}
.AppHeader-navItem {
     /*color: #ff0000 首页,发现,话题标签*/
	  color: #e9e9e9
}
.AppHeader-navItem:hover {
    color: #EEE
}
.AppHeader-navItem.is-active {
    color: #EEE
}
.AppHeader-nav {
    margin: 8px 50px
}
.SearchBar-askButton {
    display: none
}
/* 导航栏搜索框 */

.SearchBar {
    margin: 6px 39px
}
.Input-wrapper.Input-wrapper--grey {
    background: #e3e3e3;   /*搜索框的背景颜色*/
    border: 1px solid rgba(0, 0, 0, 0)
}
.Sticky.AppHeader .Popover input.Input {
    text-align: left;
    color: #000000  /*搜索框内的字体颜色,当前设置为白色*/
}
.Sticky.AppHeader .Popover input.Input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader .Popover input.Input:-moz-placeholder,
textarea:-moz-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader .Popover input.Input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader .Popover input.Input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader.is-fixed .Popover input.Input {
    text-align: left;  /*搜索框输入时字体的位置*/
    color: #000000  /*搜索框输入时字体的颜色*/
}
.Sticky.AppHeader.is-fixed .Popover input.Input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader.is-fixed .Popover input.Input:-moz-placeholder,
textarea:-moz-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader.is-fixed .Popover input.Input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader.is-fixed .Popover input.Input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #E9E9E9
}
.Sticky.AppHeader.is-fixed .Popover .Input-wrapper.is-focus {
    background-color: #48b3fd
}
.SearchBar-focusedInput {
    width: 326px;
    color: #000000 /*搜索栏光标颜色*/
    /*background-color: #ff0000*/
}
.SearchBar-searchIcon {  /*搜索放大镜标签*/
    /*background-color: #ff0000*/
    /*color: #ff0000
    /*display: none*/
	 
}
/* 卡片 */

.TopstoryMain {
    width: 720px
}
.Card.TopstoryItem:first-child {
    margin-top: 15px !important
}
.Topstory-container {
    margin: 15px auto
}
.Topstory-mainColumn {
    margin-right: 15px
}
.TopstoryHeader {
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(3, 3, 3, .1)
}
.Card.TopstoryItem {
    margin-top: 25px;
    margin-bottom: 25px;
    padding: 0;
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(3, 3, 3, .1);
    transition: .35s
}
.Card.TopstoryItem:hover {
    box-shadow: 0 10px 10px rgba(3, 3, 3, .1);
    transition: .35s
}
.Card.TopstoryItem .Feed {
    padding: 16px 20px
}
.Card.TopstoryItem.TopstoryItem--experimentExpand .ActionCard {
    padding: 16px 20px
}
.Card {
    margin-bottom: 15px;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(255, 3, 3, .1)
}
.Feed-title {
    margin-right: 15px;
    margin-bottom: 0;
    float: right
}
.Feed-meta-item {
    height: 24px;
    line-height: 24px;
    position: relative;
    top: -40px
}
.Feed-meta-item a.TopicLink {
    position: relative;
    top: 40px
}
.AuthorInfo-badge .RichText.AuthorInfo-badgeText {
    display: none
}
.RichContent-cover {
    margin-left: 12px;
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 0;
    float: right
}
/* Modal */

.Modal--fullPage {
    width: 700px
}
.Modal--fullPage .Modal-inner {
    border-radius: 10px
}
/* 问题详情页 */

.QuestionHeader {
    width: 1000px;
    min-width: 1000px;
    margin: 20px auto;
    border-radius: 15px;
    box-shadow: 0 0 20px rgba(3, 3, 3, 0)
}
.QuestionHeader-content {
    padding: 0
}
.QuestionHeader-footer-inner {
    padding: 0
}
.PageHeader.is-shown .QuestionHeader-title {  /* 问题标题颜色*/
    width: 1000px;
    color: rgba(255, 0, 0, 0);  /*最后一个零代表透明*/

}
.PageHeader.is-shown .QuestionHeader-side {
    display: none
}
.Question-main {
    margin: 15px auto
}
.Question-mainColumn {
    margin-right: 15px;
    padding-bottom: 0
}
.Question-sideColumn {
    width: 292px
}
.Question-sideColumn--sticky .Card:last-of-type {
    display: none
}
.Card-headerText {
    width: 100%;
    text-align: center
}
.AnswerItem-extraInfo {
    display: none
}
.QuestionAnswers-answerAdd {
    margin-top: 25px;
    margin-bottom: 15px !important
}
/* 关于作者 */

.Card.AnswerAuthor {
    display: none
}
/* 回答 */

.List .List-item {
    padding: 20px 40px
}
/* 首页广告 */

.Sticky .Card.Banner {
    display: none
}
.Card.TopstoryItem .Advert {
    display: none
}
.Card.TopstoryItem .Advert--card {
    display: none
}
.Card.TopstoryItem .Popover.TopstoryItem-rightButton {
    display: none
}
/* 问题详情页 - 问题状态 */

.QuestionStatus .QuestionStatus-bar {
    width: 967px;
    margin: 15px auto;
    background-color: #FFF;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(3, 3, 3, .1)
}
/* 问题详情页 - 邀请回答 */

.Question-main .Question-mainColumn .Card.QuestionInvitation {
    display: none
}
/* 个人主页 */

.Profile-sideColumn .Footer {
    display: none
}
.UserAvatarEditor.ProfileHeader-avatar .UserAvatar {
    border-radius: 500px
}
.UserAvatarEditor-maskInner {
    border-radius: 500px
}
.Mask-mask--black {
    background: rgba(255, 255, 255, .5)
}
.Card.ProfileMain .ProfileMain-header .Tabs.ProfileMain-tabs {
    padding-left: 65px
}
.Profile-sideColumn .Profile-lightList {
    margin: 15px 0;
    padding: 10px 25px;
    background-color: #FFF;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(3, 3, 3, .1)
}
.Profile-lightList .Profile-lightItem {
    border-top: 0
}
.Profile-lightList .Profile-lightItem:last-child {
    border-bottom: 0
}
.Profile-sideColumn .Profile-footerOperations {
    margin: 15px 0;
    padding: 10px 25px;
    background-color: #FFF;
    text-align: center;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(3, 3, 3, .1)
}
.PageHeader.is-shown .Tabs.ProfileMain-tabs .Tabs-item a,
.PageHeader.is-shown .Tabs.ProfileMain-tabs .Tabs-item a span {
    color: #FFF
}
.ProfileMain-menuToggler {
    color: #FFF
}
.Button.ProfileMain-menuToggler.Button--plain {
    margin-top: 2px
}
.Button.ProfileMain-menuToggler.Button--plain .Icon.ProfileMain-tabIcon.Icon--arrow {
    fill: #FFF
}
.PageHeader.is-shown .Tabs.ProfileMain-tabs {
    padding-left: 20px
}
/* 未登陆账号时问题详情页顶部导航栏“登陆”&“加入知乎”按钮样式问题 */

.AppHeader-userInfo .AppHeader-profile .Button.AppHeader-login.Button--blue {
    color: #FFF;
    border: 1px solid #FFF
}
.AppHeader-userInfo .AppHeader-profile .Button.AppHeader-login.Button--blue:hover {
    background-color: #2299EE
}
.AppHeader-userInfo .AppHeader-profile .Button.Button--primary.Button--blue {
    background: none;
    border: 1px solid #FFF
}
.AppHeader-userInfo .AppHeader-profile .Button.Button--primary.Button--blue:hover {
    background-color: #2299EE
}
/* 问题详情页“关注问题”&“写回答”按钮 */

.QuestionHeader .QuestionHeader-footer .QuestionHeader-footer-inner .QuestionHeader-side .QuestionButtonGroup .Button.Button--primary.Button--blue {
    background: none;
    background-color: #2299EE;
    color: #FFF;
    border: 1px solid #2299EE
}
.QuestionHeader .QuestionHeader-footer .QuestionHeader-footer-inner .QuestionHeader-side .QuestionButtonGroup .Button.Button--primary.Button--blue:hover {
    background-color: #2693EC
}
.QuestionHeader .QuestionHeader-footer .QuestionHeader-footer-inner .QuestionHeader-side .QuestionButtonGroup .Button.Button--blue {
    background: none;
    background-color: #2299EE;
    color: #FFF;
    border: 1px solid #2299EE
}
.QuestionHeader .QuestionHeader-footer .QuestionHeader-footer-inner .QuestionHeader-side .QuestionButtonGroup .Button.Button--blue:hover {
    background-color: #2693EC
}
/* 问题详情页 - 代码块 */

.Card .List .List-item .ContentItem.AnswerItem .RichContent.RichContent--unescapable .RichContent-inner .highlight pre {
    width: 580px;
    margin: 2em auto;
    background: none;
    background-color: #F9F9F9;
    border: 1px solid rgba(9, 9, 9, .1);
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(9, 9, 9, .1)
}
/* 个人主页 */

.UserAvatar {
    border-radius: 150px
}
.FollowButton {
    width: auto
}
.PageHeader.is-shown .ProfileMain-header .MemberButtonGroup.ProfileButtonGroup.ProfileMain-buttons .Button {
    color: #FFF;
    border: 1px solid #FFF;
    background: none
}
.PageHeader.is-shown .ProfileMain-header .MemberButtonGroup.ProfileButtonGroup.ProfileMain-buttons .Button svg.Icon.Button-icon.Icon--comments {
    fill: #FFF
}
.ProfileMain-menuToggler {
    color: #000
}
.PageHeader.is-shown .ProfileMain-header .Tabs.ProfileMain-tabs .Button.ProfileMain-menuToggler.Button--plain {
    color: #FFF
}
/* 不感兴趣 */

.Card.TopstoryItem div[data-za-module="IgnoreCard"] {
    padding: 16px 20px
}
/* 首页 - 提问 */

.Modal-wrapper .Modal.Modal--large.QuestionAsk-Modal .Modal-inner {
    border-radius: 8px
}
/* 首页 - 想法 */

.App-main .Topstory .Topstory-container .Topstory-mainColumn .Card .writePin .writePin-content {
    border-radius: 8px
}
/* 首页 - 右侧栏消息提示 */

.TopstorySideBar-navNumber {
    background: none;
    font-size: 12px;
}
/* 代码块 */

.RichText code {
    background: none;
}
/* 相关 Live 推荐 */

.Sticky .Card .Card-header.RelatedLives-title {
    display: none
}
.Sticky .Card .Card-section.RelatedLives-list {
    display: none
}



声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。