cheatsheets/firefox.html

373 lines
12 KiB
HTML

<!doctype html>
<html lang='en' class='no-js '>
<head>
<meta charset='utf-8'>
<meta content='width=device-width, initial-scale=1.0' name='viewport'>
<link href='./assets/favicon.png' rel='shortcut icon'>
<meta content='/firefox.html' name='app:pageurl'>
<title>Firefox cheatsheet</title>
<meta content='Firefox cheatsheet' property='og:title'>
<meta content='Firefox cheatsheet' property='twitter:title'>
<meta content='article' property='og:type'>
<meta content='https://assets.devhints.io/previews/firefox.jpg?t=20200622151222' property='og:image'>
<meta content='https://assets.devhints.io/previews/firefox.jpg?t=20200622151222' property='twitter:image'>
<meta content='900' property='og:image:width'>
<meta content='471' property='og:image:height'>
<meta content="The one-page guide to Firefox: usage, examples, links, snippets, and more." name="description">
<meta content="The one-page guide to Firefox: usage, examples, links, snippets, and more." property="og:description">
<meta content="The one-page guide to Firefox: usage, examples, links, snippets, and more." property="twitter:description">
<link rel="canonical" href="https://devhints.io/firefox">
<meta name="og:url" content="https://devhints.io/firefox">
<meta content='Devhints.io cheatsheets' property='og:site_name'>
<meta content='Others' property='article:section'>
<script async src='https://www.googletagmanager.com/gtag/js?id=UA-106902774-1'></script>
<script>
window.dataLayer=window.dataLayer||[];
function gtag(){dataLayer.push(arguments)};
gtag('js',new Date());
gtag('config','UA-106902774-1');
</script>
<meta property='page:depth' content='1'>
<script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
<script>(function(H){H.className=H.className.replace(/\bNoJs\b/,'WithJs')})(document.documentElement)</script>
<script>(function(d,s){if(window.Promise&&[].includes&&Object.assign&&window.Map)return;var js,sc=d.getElementsByTagName(s)[0];js=d.createElement(s);js.src='https://cdn.polyfill.io/v2/polyfill.min.js';sc.parentNode.insertBefore(js, sc);}(document,'script'))</script>
<!--[if lt IE 9]><script src='https://cdnjs.cloudflare.com/ajax/libs/nwmatcher/1.2.5/nwmatcher.min.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/json2/20140204/json2.js'></script><script src='https://cdn.rawgit.com/gisu/selectivizr/1.0.3/selectivizr.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.js'></script><![endif]-->
<style>html{opacity:0}</style>
<link rel="stylesheet" href="./assets/2015/style.css?t=20200622151222">
<link href="./assets/style.css?t=20200622151222" rel="stylesheet" />
<link href="./assets/print.css?t=20200622151222" rel="stylesheet" media="print" />
</head>
<body>
<div class='all'>
<div class='site-header'>
<div class='container'>
This is <a href="."><em>Devhints.io cheatsheets</em></a> &mdash; a collection of cheatsheets I've written.
</div>
</div>
<script type='application/ld+json'>
{
"@context": "http://schema.org",
"@type": "NewsArticle",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "https://google.com/article"
},
"headline": "Firefox cheatsheet",
"image": [ "https://assets.devhints.io/previews/firefox.jpg?t=20200622151222" ],
"description": "The one-page guide to Firefox: usage, examples, links, snippets, and more."
}
</script>
<script type='application/ld+json'>
{
"@context": "http://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "https://devhints.io/#others",
"name": "Others"
}
},{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "https://devhints.io/firefox",
"name": "Firefox"
}
}]
}
</script>
<div class='post-list -single -cheatsheet'>
<div class='post-item'>
<div class='post-headline -cheatsheet'>
<p class='prelude'><span></span></p>
<h1><span>Firefox</span></h1>
<ul class="social-list ">
<li class="facebook link hint--bottom" data-hint="Share on Facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=https://devhints.io/firefox.html" target="share"><span class="text"></span></a></li>
<li class="twitter link hint--bottom" data-hint="Share on Twitter"><a href="https://twitter.com/intent/tweet?text=The%20ultimate%20cheatsheet%20for%20Firefox.%20https://devhints.io/firefox.html" target="share"><span class="text"></span></a></li>
</ul>
</div>
<div class='post-content -cheatsheet'>
<h3 id="firefox-31-july-2014"><a href="https://www.mozilla.org/en-US/firefox/31.0/releasenotes/">Firefox 31</a> (July 2014)</h3>
<ul>
<li>CSS: variables</li>
</ul>
<h3 id="firefox-30-june-2014"><a href="https://developer.mozilla.org/en-US/Firefox/Releases/30">Firefox 30</a> (June 2014)</h3>
<ul>
<li>CSS: Allow <code>line-height</code> in <code>&lt;input type='button'&gt;</code></li>
<li>JS: <code>Console.count()</code></li>
<li>JS: ES6 array and generator comprehensions</li>
</ul>
<h3 id="firefox-29-april-2014">Firefox 29 (April 2014)</h3>
<ul>
<li>New UI</li>
<li>CSS: Unprefixed <code>box-shadow</code></li>
</ul>
<h3 id="firefox-18-jan-2013">Firefox 18 (Jan 2013)</h3>
<ul>
<li>Faster JS compiler (IonMonkey)</li>
<li>Mac retina support</li>
<li>JS: <code>window.devicePixelRatio</code></li>
<li>JS: unprefixed <code>ontouchstart</code></li>
<li>HTML: <code>&lt;input type='number'&gt;</code></li>
<li>HTML: <code>&lt;input type='color'&gt;</code></li>
</ul>
<h3 id="firefox-17-nov-2012">Firefox 17 (Nov 2012)</h3>
<ul>
<li>No more support for Mac OSX 10.5 and below</li>
<li>SVG <code>FillPaint</code> and <code>StrokePaint</code></li>
<li>HTML <code>&lt;iframe sandbox=...&gt;</code> (<a href="https://developer.mozilla.org/en-US/docs/HTML/Element/iframe#attr-sandbox">docs</a>)</li>
<li>Official support for Windows 8 (<a href="http://www.mozilla.org/en-US/firefox/17.0/system-requirements/">link</a>)</li>
</ul>
<h3 id="firefox-16-oct-2012">Firefox 16 (Oct 2012)</h3>
<ul>
<li>Web app support (<a href="https://developer.mozilla.org/en-US/docs/Apps/Getting_Started">docs</a>)</li>
<li>Unprefixed CSS animations, transitions, transforms, gradients</li>
</ul>
<h3 id="firefox-15-aug-2012">Firefox 15 (Aug 2012)</h3>
<ul>
<li>Background updates</li>
<li>SPDY v3</li>
<li>Opus audio codec</li>
<li>HTML <code>&lt;audio played&gt;</code> (and <code>&lt;video&gt;</code>)</li>
<li>HTML <code>&lt;source media=...&gt;</code></li>
</ul>
<h3 id="firefox-14-jul-2012">Firefox 14 (Jul 2012)</h3>
<ul>
<li>Full screen support for OSX Lion</li>
<li>JS pointer lock API (<a href="https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API">docs</a>)</li>
<li>JS display sleep API (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=697132">docs</a>)</li>
</ul>
<h3 id="firefox-13-jun-2012">Firefox 13 (Jun 2012)</h3>
<ul>
<li>Smooth scrolling by default</li>
<li>SPDY on by default</li>
<li>CSS <code>column-fill</code> (<a href="https://developer.mozilla.org/en/CSS/column-fill">docs</a>)</li>
<li>ECMA 6 <code>Map</code> and <code>Set</code></li>
<li>CSS <code>background-position</code> extended syntax</li>
<li>CSS <code>:invalid</code></li>
<li>CSS turn unit (<code>rotate(0.5turn)</code>)</li>
</ul>
<h3 id="firefox-12-apr-2012">Firefox 12 (Apr 2012)</h3>
<ul>
<li>CSS <code>text-align-last</code> (<a href="https://developer.mozilla.org/en/CSS/text-align-last">docs</a>)</li>
</ul>
<h3 id="firefox-11-mar-2012">Firefox 11 (Mar 2012)</h3>
<ul>
<li><code>element.outerHTML</code> (<a href="https://developer.mozilla.org/en-US/docs/DOM/element.outerHTML">docs</a>)</li>
<li>Dev tools: Style editor, 3D page inspector (<a href="https://hacks.mozilla.org/2011/12/new-developer-tools-in-firefox-11-aurora/">docs</a>)</li>
<li>Unprefixed web sockets</li>
<li>CSS <code>text-size-adjust</code> (<a href="https://developer.mozilla.org/en-US/docs/CSS/text-size-adjust">docs</a>)</li>
</ul>
<h3 id="firefox-10-jan-2012">Firefox 10 (Jan 2012)</h3>
<ul>
<li>CSS 3D transforms</li>
<li>HTML <code>&lt;bdi&gt;</code> element</li>
<li>JS fullscreen API (<a href="https://wiki.mozilla.org/Platform/Features/Full_Screen_APIs">docs</a>)</li>
<li>IndexedDB APIs</li>
<li>Dev tools: CSS Style inspector</li>
</ul>
<h3 id="firefox-9-dec-2011">Firefox 9 (Dec 2011)</h3>
<ul>
<li>Two-finger swipe in Mac OSX Lion</li>
<li>CSS <code>font-stretch</code></li>
<li>CSS improved <code>text-overflow</code></li>
<li>JS <code>navigator.doNotTrack</code></li>
</ul>
<h3 id="firefox-8-nov-2011">Firefox 8 (Nov 2011)</h3>
<h3 id="firefox-7-sep-2011">Firefox 7 (Sep 2011)</h3>
<ul>
<li>CSS <code>text-overflow: ellipsis</code></li>
<li>Hidden <code>http://</code> prefix in address bar</li>
</ul>
<h3 id="firefox-6-aug-2011">Firefox 6 (Aug 2011)</h3>
<ul>
<li>JS <code>window.matchMedia</code></li>
<li>Websockets (!)</li>
<li>JS EvetnSource / server-sent events</li>
</ul>
<h3 id="firefox-5-jun-2011">Firefox 5 (Jun 2011)</h3>
<ul>
<li>CSS animations</li>
<li>Background tab <code>setTimeout</code> and <code>setInterval</code> clamped to 1000ms</li>
</ul>
<h3 id="firefox-4-mar-2011">Firefox 4 (Mar 2011)</h3>
<ul>
<li>Do Not Track (DNT) header</li>
<li>New JS endinge (JagerMonkey)</li>
<li>Hardware-accelerated rendering</li>
<li>WebM video</li>
<li>OpenType ligatures/kerning/font variants</li>
<li>CSS transitions partial support</li>
<li>JS audio data API</li>
<li>JS <code>mozRequestAnimationFrame</code></li>
<li>HTML5 forms API</li>
<li><code>&lt;video buffered&gt;</code></li>
<li>HTML5 history API</li>
<li>New HTML5 parser</li>
<li></li>
</ul>
<h3 id="firefox-36-jan-2010">Firefox 3.6 (Jan 2010)</h3>
<ul>
<li>CSS gradients</li>
<li>CSS pointer events</li>
<li>HTML drag &amp; drop API</li>
<li>HTML <code>&lt;script async&gt;</code></li>
</ul>
<h3 id="reference">Reference</h3>
<ul>
<li><a href="https://www.mozilla.org/en-US/firefox/releases/">Firefox releases</a></li>
</ul>
</div>
<ul class="social-list ">
<li class="facebook link hint--bottom" data-hint="Share on Facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=https://devhints.io/firefox.html" target="share"><span class="text"></span></a></li>
<li class="twitter link hint--bottom" data-hint="Share on Twitter"><a href="https://twitter.com/intent/tweet?text=The%20ultimate%20cheatsheet%20for%20Firefox.%20https://devhints.io/firefox.html" target="share"><span class="text"></span></a></li>
</ul>
</div>
</div>
<div class="about-the-site">
<div class="container">
<p class='blurb'>
<strong><a href=".">Devhints.io cheatsheets</a></strong> is a collection of cheatsheets I've written over the years.
Suggestions and corrections? <a href='https://github.com/rstacruz/cheatsheets/issues/907'>Send them in</a>.
<i class='fleuron'></i>
I'm <a href="http://ricostacruz.com">Rico Sta. Cruz</a>.
Check out my <a href="http://ricostacruz.com/til">Today I learned blog</a> for more.
</p>
<p class='back'>
<a class='big-button -back -slim' href='.#toc'></a>
</p>
<p>
</p>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.5/highlight.min.js"></script>
<script src="https://cdn.rawgit.com/rstacruz/unorphan/v1.0.1/index.js"></script>
<script>hljs.initHighlightingOnLoad()</script>
<script>unorphan('h1, h2, h3, p, li, .unorphan')</script>
</body>
</html>