Tips and Tricks for Chrome
Category Programming Technology
Chrome is a modern web browser developed by Google, known for its efficient V8 JavaScript engine and as one of the top three browsers.
With its clean interface and user-friendly features, Chrome has risen to a 45% market share, surpassing Internet Explorer and Mozilla Firefox to become the world's leading browser. (Data from Wikipedia)
Web Store offers extensions for custom use.
Next, I will introduce some commonly used extensions:
-
-
-
-
-
-
-
Awesome Screenshot: Capture & Annotate
-
-
-
-
-
-
-
-
-
-
tampermonkeyhttps://greasyfork.org/zh-CN/ 寻找
-
-
My favorite Chrome extensions are Evernote and Pocket.
Here are some custom optimization settings for Chrome:
For example, I like to force my browser to display fonts as Google's Noto font using the Stylish extension to customize CSS:
*:not([class*="icon"]):not([class*="mui-amount"]):not([class*="chaoshi"]):not([class*="top-nav"]):not([href*="ju.taobao.com"]):not([class*="Icon"]):not([class*="prev"]):not([class*="next"]):not([class*="pay-"]):not([class*="tm-shop-list-"]):not(b):not(ins):not(i):not(s){font-family:"Noto Sans CJK SC Regular"!important;}
Or to remove underlines from text URLs:
* {text-decoration:none!important;}
Or to customize the browser's scrollbar style Reference Link *This feature may be removed in newer versions of Chrome:
::-webkit-scrollbar{
width:3px;
height:6px;
background-color:#fff;
}
::-webkit-scrollbar:hover{
background-color:#eee;
}
::-webkit-scrollbar-thumb{
min-height:5px;
min-width:5px;
-webkit-border-radius:20px;border:1px solid#888;
::-webkit-border-radius:1px;
background-color: #AAA;
}
::-webkit-scrollbar-thumb:hover{
min-height: 4px; min-width: 4px; -webkit-border-radius: 20px; border: 1px solid #444; background-color: #AAA; } ::-webkit-scrollbar-thumb:active { -webkit-border-radius: 20px; border: 1px solid #444; background-color: #AAA; }
More CSS styles can be found at [https://userstyles.org](https://userstyles.org).
Chrome has many powerful hidden features. Here are some commonly used hidden settings:
The phone icon button in the top left corner is the developer tool emulator. It can simulate the display of mobile device web compatibility by changing UA and other settings.
There are more settings for the emulator at the bottom.
The developer tool also has a commonly used web element sniffing feature.
You can also find out the loading status of elements on this page.
If the page content or functionality is not normal, you can try clearing the Cookie (this file records some user information, redacted (//∇//)) or the page Cache.
When the developer tool is open, clearing the page cache can be done by long-pressing the refresh button in the top left corner to reveal the cleaning menu options.
Additionally, long-pressing the back button allows you to select previously opened pages (this does not require the developer tool to be open).
Next, let's introduce some hidden debugging settings in Chrome: `chrome://flags`, `Ctrl+F` or `Command+F` to search for `quic`.
Non-Mac users are advised to enable overlay scrollbars.
Non-Windows users are strongly recommended to disable the Flash plugin to ensure smooth and stable browsing: `chrome://plugins`, find the Adobe Flash Player plugin and disable it.
Use an HTML5 player instead: [http://zythum.sinaapp.com/youkuhtml5playerbookmark/](http://zythum.sinaapp.com/youkuhtml5playerbookmark/)
Or add a bookmark:
javascript:(function(){var l = document.createElement('link');l.setAttribute('rel','stylesheet');l.setAttribute('media','all');l.setAttribute('href','http://zythum.sinaapp.com/youkuhtml5playerbookmark/youkuhtml5playerbookmark2.css');document.body.appendChild(l);var s = document.createElement('script');s.setAttribute('src','http://zythum.sinaapp.com/youkuhtml5playerbookmark/youkuhtml5playerbookmark2.js');document.body.appendChild(s);})();
Open a webpage containing a video and click the bookmark to use the HTML5 player.
If you need to access certain non-existent websites with forced HTTPS, you can install the [HTTPS Everywhere](https://chrome.google.com/webstore/detail/https-everywhere/gcbommkclmclpchllfjekcdonpmejbdp) extension.
You can also set up a list of URLs in `chrome://net-internals/#hsts`, such as adding Wikipedia [https://wikipedia.org/](https://wikipedia.org/) and all subdomains (remember to check the two options about subdomains) to the HSTS list.
Then the page will be forced to use HTTPS encrypted connections.
Open `chrome://chrome-urls/` to find many hidden setting entries.
A line of code can turn Chrome into a temporary text editor (from [Jobbole](http://blog.jobbole.com/32823/)):
data:text/html, <html contenteditable>
This uses the Data URI format and tells the browser to render HTML. However, contenteditable is a new global attribute in HTML5, so this trick only works in modern browsers that support this attribute.
Jakeonrails modified it to support code highlighting: [https://gist.github.com/jakeonrails/4666256](https://gist.github.com/jakeonrails/4666256)
data:text/html, <style type="text/css">#e{position:absolute;top:0;right:0;bottom:0;left:0;}</style><div id="e"></div><script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script>var e=ace.edit("e");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/python");</script> ```
Tip: If you change ace/mode/python to ace/mode/ruby, you get a Ruby editor. Other languages follow this pattern.
To support syntax highlighting for other languages, replace ace/mode/ruby with:
Python -> ace/mode/python
Jakeonrails uses the monokai style for syntax highlighting.
Eclipse -> ace/theme/eclipse
For those who don't want to copy and paste the code, you can directly click on these links:
English: Ruby Editor, Python Editor, PHP Editor, Javascript Editor, Java Editor, C/C++ Editor (You can also bookmark these links in your browser.)
Official Instructions and Zhihu
Want to save a webpage as a PDF? Press Ctrl+P, then change the target printer to "Save as PDF" on the print page, and finally press save, it's very stylish.
Ctrl+Shift+N to open Incognito Mode. Your browsing history and Cookies will not be saved. Enjoy.
Tired of Chrome opening too many pages and getting too slow? Just press Shift+Esc to open the Task Manager, close what you want, no need to close one by one with Ctrl+W.
The combination key Ctrl+Shift+T is used to restore accidentally closed pages.
Alt+Home to quickly return to your homepage.
Ctrl+H to quickly view history.
Ctrl+J to quickly view download history.
Want to quickly select the address bar? Press F6, which is equivalent to Ctrl+L, and also equivalent to Alt+D.
To quickly delete your browsing history, just hold down Ctrl+Shift+Delete.
Ctrl+Tab to switch pages from left to right, Ctrl+Shift+Tab to switch from right to left.
Ctrl+1 to quickly return to the first (leftmost) page, Ctrl+9 to quickly return to the rightmost page.
Want to read various novels but complain about the small screen? Press F11 to enjoy the full screen.
No PDF reader? No problem, just drag the PDF file into the Chrome window to view it.
Important webpage tabs can be pinned to prevent accidental closure.
More Chrome tricks await you to discover.
This blog is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.