当前位置: 首页 > news >正文

【stylus】通过css简化搜索页面样式

  • 发现stylus专门修改样式的插件后,发现之前写JS调整样式的方式是在太蠢了,不过有一些交互的东西还是得用JS,例如设置按钮来交互显示功能,或记录功能等。
  • 插件可以让简化网站变得简单,而且可以实时显示,真的不要太舒服,以后看那个网站不顺眼,就可以直接简化,不懂就查一下一下CssSelector。
  • 使用技巧。下载一个别人模板,然后根据自己的喜好去修改。

百度样式调整

 /* 关闭用户 */ 
.result-molecule, #u {display: none;
}/* 调整关闭元素后导致的显示异常 遮罩高度调整 */#s_tab {padding-left: 150px !important;} 
.s_form {height: 10px !important;
}/* 调整关闭元素后导致的显示异常 搜索内容*/
#content_left {padding-top: 60px !important;width: 90%!important;
}/* 调整关闭元素后导致的显示异常 导航栏*/#s_tab {padding-left: 150px !important;
} /* 固定分列显示后的高度,否则一高一低浪费很多显示空间 */ 
.result, .result-op, .c-container{height: 300px!important;
}/* 固定搜索框 */    
#head {position: absolute !important;} /* 百度知道 贴吧 顶部冗余部分*/ 
.header-wrapper ,.navbar-wrapper , .head_inner, .pc-topbar{display: none;
}
.lemmaWgt-searchHeader, .fixedWrapper_OveTv, .-F_R2 {display: none!important;}

谷歌调整

 /* 关闭搜索字数显示、用户栏、导航栏 */   
#appbar,.rfiSsc, .Q3DXx > *[class^="Q3DXx"] {display: none;}/* 调整框分列后的搜索框显示 */   
.MjjYud , .hlcw0c, .ULSxyf {/* 框 使其透明 */ border: 1px!important;background-color: rgba(255, 255, 255, 0.5)!important;    margin-bottom: 1px!important;              }/* 使分列框其自动换行 */ div[jscontroller="SC7lYd"], .g{width: 100% !important;          }/* 特殊调整边距 */ div[data-hveid="CAgQGw"]{margin-left: -10% ; }

ybmusic

    // 设置显示专辑封面而不是视频#song-video{display: none!important;}#song-image{display: block!important;}//冗余的padding去掉#player-page > div{padding: 5px}
http://www.lryc.cn/news/136436.html

相关文章:

  • 【官方中文文档】Mybatis-Spring #使用 SqlSession
  • Redis三种持久化方式详解
  • 17.2 【Linux】通过 systemctl 管理服务
  • 第 7 章 排序算法(3)(选择排序)
  • Less文件可以做哪些复杂操作
  • HTML5岗位技能实训室建设方案
  • 【Linux】GNOME图形化界面安装
  • 大数据课程J3——Scala的类定义
  • Ribbon:使用Ribbon实现负载均衡
  • 最新最全的~教你如何搭建高可用Lustre双机集群
  • 深入浅出Pytorch函数——torch.nn.init.uniform_
  • 会员管理系统实战开发教程02-H5应用创建
  • 记一次由于整型参数错误导致的任意文件上传
  • spring之Spring Security - 实现身份验证与授权
  • 【Unity3D赛车游戏】【二】如何制作一个真实模拟的汽车
  • 【Linux】线程篇Ⅱ:
  • 浅尝OpenResty
  • MySQL分页查询慢怎么办
  • mongodb集群
  • 回归预测 | MATLAB实现WOA-BP鲸鱼优化算法优化BP神经网络多输入单输出回归预测(多指标,多图)
  • 【前端从0开始】JavaSript——循环控制语句
  • 【Elasticsearch】spring-boot-starter-data-elasticsearch的使用以及Elasticsearch集群的连接
  • Python学习笔记_进阶篇(四)_django知识(三)
  • 指针(初阶)
  • Flink内核源码解析--Flink中重要的工作组件和机制
  • Linux 压缩解压(归档管理):tar命令
  • spring boot集成mqtt协议发送和订阅数据
  • 【数据库】详解数据库架构优化思路(两主架构、主从复制、冷热分离)
  • el-table 实现动态表头 静态内容 根据数据显示动态输入框
  • Reids 的整合 Spring Data Redis使用