当前位置: Chrome插件首页 > 开发者插件 > Stylist:自定义网页CSS Chrome插件 > Stylist:自定义网页CSS Chrome插件详细图文介绍

Stylist:自定义网页CSS 图文介绍

Stylist:自定义网页CSS Chrome插件图片

chrome浏览器的造型师。用户样式应用到任何网站,像时尚一样去自定义您的网站!

注:中文翻译来自GOOGLE

Stylist插件概述

我们在上时间对着电脑上网后,即使不厌倦了网页的字体也很可能会出现视力疲劳的情况,有事会想自己给Google写CSS?想恶搞网页?或者修改一下网页的字体或者背景色等!这一切的需求,Chrome Stylist都可能帮你实现!Stylist就是这样一款小巧的,可以帮助用户实现自定义网页CSS样式的chrome扩展插件。可以将任何网页以你想修改的样式呈现。

Stylist插件下载安装

Stylist插件哪里可以下载?

你可以从chrome应用商店里找到Stylist插件,如果你的chrome应用商店无法打开,你可以在本站的下方找到Stylist插件下载地址。不过很遗憾,在我整理这篇文章的时候,在chrome应用商店并没有找到这款插件。

Stylist插件怎么安装?
1. 如果你能够打开chrome应用商店,并且可以找到Stylist插件,那么直接点击“添加至chrome”

2.如果你的chrome应用商店无法打开,你从本站或者其他途径获得了Stylist插件,那么就选择离线安装该插件。由于Stylist插件同其他chrome插件一样都是CRX格式的,所以具体的安装方法请参照:怎么在谷歌浏览器中安装.crx扩展名的离线Chrome插件? 如果CRX格式插件不能离线安装怎么办

3.如果chrome商店可以打开,但是找不到这款插件,那么安装方法参见本站chrome浏览器中如何使用已停用的扩展程序和插件?

Stylist插件使用说明

1.在chorme浏览器安装好stylist后,在浏览器的右上方会看到stylist的按钮标记。比如你希望让网页字体变更为徐静蕾字体,就可以在Chrome Stylist的styles中写入: *{font-family: "方正静蕾简体", "华文行楷","微软雅黑", sans-serif !important; } PS:如果是修改字体,那么你的设备中应该已经安装了相应的字体,否则修改是无效的。

2.用户还可以设置背景颜色: 工具->扩展程序找到Stylist  点选项进行设置    如下图所示点Styles--demo---选择All site   再把这段代码粘贴在下面就行了   
 * { background: #C7EDCC !important; }      
其中  #C7EDCC为你要设置的颜色     你可以设置任意颜色   这个颜色是看别人这样说比较保护眼睛   所以也就推荐下  个人觉得这个颜色还不错  
Google Chrome(谷歌浏览器)修改网页背景颜色的办法(比如修改为护眼的豆沙绿) - goodman_yunfei - 过客
附:豆沙绿的参数 RGB颜色 199;237;204 十六位颜色代码 #C7EDCC 色调:85;饱和度:123;亮度:205

3.用户还可以利用stylist的功能屏蔽新浪微博上的广告。
DIY 自己的微博界面或者其他的网站,比如腾讯微博、QQ 空间、Facebook 等等。方法如下:依次点击 “选项” – “设置” – “扩展程序” 和 Stylist 旁的 “选项”。
stylist
点击选项卡中的 “Style” 页签,然后点击 “Add New Style”;在顶部的黑色输入框里输入 “Weibo”;把 Style set 下方的下拉框选择为 “domain”,在旁边的输入框里输入 “weibo.com”;将以下代码复制到最大的文本框里,然后点击 “Save” 保存。
.W_rightModule, __regexoperators___/* 隐藏右侧栏广告 */
.hot_topicad, __regexoperators___/* 隐藏热点话题中的广告 */
#pl_leftnav_app, __regexoperators___/* 隐藏左侧栏的最近应用 */
#trustPagelet_recom_memberv5, __regexoperators___/* 隐藏右侧栏的会员专区 */
#pl_rightmod_noticeboard, __regexoperators___/* 隐藏右侧栏的公告栏 */
__regexoperators___/* 隐藏侧栏微吧内容 */
#trustPagelet_indexright_recom .WB_right_module:last-child,
#topicAD > ul, __regexoperators___/* 隐藏最新的热点话题广告 - 20130815 更新 */
[node-type=hot], __regexoperators___/* 隐藏导航栏里的“热点” */
[node-type=feed_spread], __regexoperators___/* 隐藏信息流里的推广内容 */
[node-type=member], __regexoperators___/* 隐藏导航栏里的“会员”*/
[feedtype=ad], __regexoperators___/* 隐藏信息流里的广告 */
[ad-data] { __regexoperators___/* 隐藏宽幅广告 */
    display: none;
}
[node-type=game] { __regexoperators___/* 隐藏导航栏里的“游戏” */
    visibility: hidden;
}
.WB_webim { __regexoperators___/* 淡化侧面的在线聊天栏 */
    opacity: .3;
}
.WB_webim:hover { __regexoperators___/* 鼠标移到聊天栏上时变回正常 */
    opacity: .9;
}
__regexoperators___/* 下面这些是调松页面布局的 */
.WB_right_module {
    margin: 40px 0 20px;
}
.WB_feed .WB_feed_type {
    margin: 20px 20px 0;
}
#pl_content_homeFeed {
    margin-top: 30px;
}
如下图所示:

Stylist插件相关推荐

1.网站样式管理器-Stylish

2.Vimium插件

Stylist插件英文介绍

Chrome Stylist
User styles are applied to any website, like Stylish.
Customize your web!

experimentally supported for http://userstyles.org/

Stylist:自定义网页CSS 相关插件推荐

NetBeans Connector

开发者插件 2019-05-19 03:19:17

在NetBeans Connector提供获奖的NetBeans IDE和谷歌Chrome浏览器。
的NetBeans IDE提供了一套完整的JavaScript和HTML5的开发工具,包括代码编辑,调试,现场造型,开发与iOS和Android的奖项之间的深

Better Ruler

开发者插件 2019-04-16 11:06:34

> 一个网页测量工具,它可以吸附到网页元素周围,从而更方便的测量。

- 点击插件图标即可开始测量,再次点击将退出测量。
- 移动鼠标的同时按住`Alt`键,可实时显示当前鼠标所在位置的元素的大小。
- 移动鼠标的同时按住`Alt`键,如果在吸附范围内(距离元素边界50px内,距离顶点15px内,可在底部工具栏自定义)可自动吸附。
- 按下`f`键,显示和隐

ARChon Runtime APK for Chrome

开发者插件 2019-05-07 08:24:21

在 OS X 中运行 Chrome 中的 Android 应用程序, linux 和 Windows
Chrome 的 ARChon 运行时 APK 是直接从手机创建定制 Chrome ARChon 时间数据包的一种方便方式。
您可以从手机上的 APK 或手机上的应用程序中创建 chrome 包! 打开应用程序,从列表中选择 APK 或应用程序。从 APK 中提取应用程序名

web performance

开发者插件 2015-11-03 10:29:03

Get the web perfomance by timing API
Get the page performance by Navigation Timing API, and show a waterfall chart to the developers or users!

Animation Generator

开发者插件 2015-11-06 00:13:05

Generate CSS Animation code for your page
Animation Generator是集成在开发者工具Devtools的一个功能。它能帮助开发者迅速为原本死气沉沉的页面上的元素添加动画和实时预览,并生成兼容多浏览器的CSS动画代码。

你只需要以下步骤,便可复活你的页面:
1. 在HTML中,为需要添加动画的元素添加前缀为&qu

JavaScript Notepad

开发者插件 2015-02-10 11:34:38

JavaScript的记事本,您可以执行JavaScript , HTML和CSS代码中的一个简单的编辑器。
你有没有想考一些HTML , CSS或JavaScript ,而无需打开一个文本编辑器?现在,你不必再使用JavaScript记事本。您可以直接点击扩展和测试您在网站上的代码。

用文本编辑器,你必须打开文本编辑器。然后,你必须编写的代码,最后在浏览器中打开它。

有了这个扩展,你只需要点击按钮,然后键入的代码。The JavaScript",1,

XML Tree

开发者插件 2019-11-07 09:06:48

XML Tree插件是针对使用chrome浏览器的用户打造的一款xml字符串解析和格式插件,用户在chrome中安装了XML Tree插件以后,就可以通过把本地的xml字符串上传谷歌浏览器的扩展中,并使用chr

天蓬插件

开发者插件 2017-07-26 21:34:48

Tianji for data extraction from websites
天机网络信息云采集平台开发的配套插件,用于采集网络中的公开数据,无需开发基础,只需要使用浏览器和平台提供的插件,就能对页面的数据进行可视化的配置。同时,云采集平台支持将插件中的配置方案同步到云端,在云端的配置后台,您可以增加更多的配置信息用于满足更专业的需求。

iFormatTool

开发者插件 2015-11-30 18:18:51

本工具用于查看js、json、css等源码时对其进行高亮、格式化、美化、压缩等操作
本工具用于查看js、json、css等源码时对其进行高亮、格式化、美化、压缩等操作

#如何使用:
打开类型或后缀为css、js、json的网址,插件会自动高亮显示代码,根据不同类型提供不同操作按钮。

#例如:
localhost/1.

Xdebug helper

开发者插件 2019-12-06 11:21:12

每个人都必须拥有使用Xdebug调试,分析和跟踪PHP代码的功能。 此扩展将帮助您轻松地启用/禁用调试,性能分析和跟踪,而不必费力地处理POST / GET变量或cookie。对于使用带有Xdebug支持的

WeChat WebView Debug

开发者插件 2018-11-24 23:31:14

WeChat WebView Debug
==

模拟微信应用中打开网页时原生注入的 WeixinJSBridge 对象,方便在开发环境中调试

神马搜索月刊推荐

开发者插件 2017-08-06 16:35:51

神马搜索月刊收集,被推荐的页面会在 month.fe.sm.cn 上显示
神马搜索月刊推荐面向大众啦,你可以安装此插件,然后看到有意思的前端文章点击插件推荐给我们。可以在http://month.fe.sm.cn上查看你所推荐的文章

二维码网址

开发者插件 2015-05-07 21:03:09

点击生成手机可访问的二维码网址,作者:zxing@97md.net
点下图标就可以将你当前网址生成二维码,方便快捷的手机网址输入工具!

CSS3 Click Chart

开发者插件 2015-12-07 11:40:03

酷和快速访问在线CSS3图
此扩展增加了一个功能强大的CSS3图表,您正在查看的页面

将图像保存为 JPEG

开发者插件 2018-01-30 11:46:59

扩展名 "将图像保存为 JPEG" 将图像转换为 JPEG 显示对话框之前 "Save as".

适用于任何基于Chromium的浏览器(如:Opera,Yandex浏览器等)。
___________________________________________

扩展名 "将图像保存为 JPEG" Save Image As JPEG 是非常简单的方

Nextsense XML Signing Component v1.0.1.3

开发者插件 2019-05-05 13:32:51

Nextsense XML 签名组件是支持 XML 文档数字签名和签名验证的基于 web 的组件。该产品的开发是为了使浏览器能够使用用户的本地数字证书对文档进行签名,并且得到了领先的 web 浏览器的支持。Nextsense XML 签名组件具有以下优点:
-使用用户的本地数字证书从 web 浏览器对文档进行简单的数字签名,它提供了签名者身份和文档完整性的证明
-支持检测和验证