diff options
Diffstat (limited to 'files/ru/web')
9 files changed, 214 insertions, 256 deletions
diff --git a/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html b/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html new file mode 100644 index 0000000000..93f8f9634e --- /dev/null +++ b/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html @@ -0,0 +1,132 @@ +--- +title: Browser storage limits and eviction criteria +slug: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria +tags: + - IndexedDB + - данных + - клиентская сторона +translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria +--- +<div>{{DefaultAPISidebar("IndexedDB")}}</div> + +<p class="summary">Существует целый ряд веб-технологий, которые хранят данные того или иного рода на стороне клиента (то есть на локальном диске). Процесс, с помощью которого браузер решает, сколько места выделить для хранения веб-данных и что удалить, когда этот предел будет достигнут, не прост и отличается между браузерами. В этой статье описывается, как браузеры определяют, какой локальный контент следует очистить и когда, чтобы освободить необходимое локальное пространство для хранения.</p> + +<div class="note"> +<p><strong>Примечание</strong>: приведенная ниже информация должна быть достаточно точной для большинства современных браузеров, но специфика браузера вызывается там, где она известна. Opera и Chrome должны вести себя одинаково во всех случаях. Opera Mini (все еще основанная на presto, серверная визуализация) не хранит никаких данных на клиенте.</p> +</div> + +<h2 id="Какие_технологии_используют_браузерные_хранилища_данных">Какие технологии используют браузерные хранилища данных?</h2> + +<p>В Firefox следующие технологии используют хранилище данных браузера для хранения данных, когда это необходимо. В этом контексте мы называем их "квотными клиентами": </p> + +<ul> + <li><a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a></li> + <li><a href="http://asmjs.org/">asm.js</a> кэширование</li> + <li><a href="/en-US/docs/Web/API/Cache">Cache API</a></li> + <li>Cookies</li> +</ul> + +<div class="note"> +<p><strong>Примечание</strong>: В Firefox веб-хранилище скоро начнет использовать те же инструменты управления хранилищем, что и в этом документе.</p> +</div> + +<div class="note"> +<p><strong>Примечание</strong>: в режиме приватного просмотра большинство хранилищ данных не поддерживается. Данные локального хранилища и файлы cookie все еще хранятся, но они эфемерны — данные удаляются, когда вы закрываете последнее окно приватного просмотра.</p> +</div> + +<p>The "last access time" of origins is updated when any of these are activated/deactivated — origin eviction will delete data for all these quota clients.</p> + +<p>In Chrome/Opera, the Quota Management API handles quota management for <a href="/en-US/docs/Web/HTML/Using_the_application_cache">AppCache</a>, <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a>, WebSQL, and <a href="/en-US/docs/Web/API/File_System_API">File System API</a>.</p> + +<h2 id="Different_types_of_data_storage">Different types of data storage</h2> + +<p>Even in the same browser, using the same storage method, there are different classes of data storage to understand. This section discusses the different ones you might find in different browsers.</p> + +<p>Storage comes in two types:</p> + +<ul> + <li>Persistent: This is data that is intended to be kept around for a long time. This will only be evicted if the user chooses to (for example, in Firefox you can choose to delete all stored data or only stored data from selected origins by going to <em>Preferences</em> and using the options under <em>Privacy & Security > Cookies & Site Data</em>).</li> + <li>Temporary: This is data that doesn't need to persist for a very long time. This will be evicted under a least recently used ({{anch("LRU policy")}}) when {{anch("Storage limits")}} are reached.</li> +</ul> + +<p>In Firefox, when persistent storage is used, the user is given a UI popup to alert them that this data will persist, and asks if they are happy with that. Temporary data storage does not elicit any user prompts.</p> + +<p>Storage is temporary by default; developers can choose to use persistent storage for their sites using the {{domxref("StorageManager.persist()")}} method available in the <a href="/en-US/docs/Web/API/Storage_API">Storage API</a>.</p> + +<h2 id="Where_is_the_data_stored">Where is the data stored?</h2> + +<p>Each storage type represents a separate repository. Here's the actual mapping to directories under a user's Firefox profile (other browsers may differ slightly):</p> + +<ul> + <li><code><profile>/storage</code> — the main top-level directory for storages maintained by the quota manager (see below)</li> + <li><code><profile>/storage/permanent</code> — persistent data storage repository</li> + <li><code><profile>/storage/temporary</code> — temporary data storage repository</li> + <li><code><profile>/storage/default</code> — default data storage repository</li> +</ul> + +<div> +<div class="note"> +<p><strong>Note</strong>: After introducing <a href="/en-US/docs/Web/API/Storage_API">Storage API</a>, the "permanent" folder can be considered obsolete; the "permanent" folder only stores IndexedDB persistent-type databases. It doesn't matter if box mode is "best-effort" or "persistent" — data is stored under <profile>/storage/default.</p> +</div> +</div> + +<div class="note"> +<p><strong>Note</strong>: In Firefox, you can find your profile folder by entering <code>about:support</code> in the URL bar, and pressing the <em>Show in...</em> button (e.g., <em>Show in Finder</em> on Mac OS X) next to the <em>Profile Folder</em> title.</p> +</div> + +<div class="note"> +<p><strong>Note</strong>: If you are looking around in your Profile at the data stored, you might see a fourth folder: <code>persistent</code>. Basically, the <code>persistent</code> folder was renamed to <code>permanent</code> a while ago to keep upgrades/migration simpler.</p> +</div> + +<div class="note"> +<p><strong>Note</strong>: Users shouldn’t add their own directories or files under <code><profile>/storage</code>. This will cause storage initialization to fail; for example, {{domxref("IDBFactory.open()", "open()")}} will fire an error event.</p> +</div> + +<h2 id="Storage_limits">Storage limits</h2> + +<p>The maximum browser storage space is dynamic — it is based on your hard drive size. The <strong>global limit</strong> is calculated as 50% of free disk space. In Firefox, an internal browser tool called the Quota Manager keeps track of how much disk space each origin is using up, and deletes data if necessary.</p> + +<p>So if your hard drive is 500 GB, then the total storage for a browser is 250 GB. If this is exceeded, a process called <strong>origin eviction</strong> comes into play, deleting an entire origin's worth of data until the storage amount goes under the limit again. There is no trimming effect put in place to delete parts of origins — deleting one database of an origin could cause problems with inconsistency.</p> + +<p>There's also another limit called <strong>group limit</strong> — this is defined as 20% of the global limit, but it has a minimum of 10 MB and a maximum of 2 GB. Each origin is part of a group (group of origins). There's one group for each eTLD+1 domain. For example:</p> + +<ul> + <li><code>mozilla.org</code> — group1, origin1</li> + <li><code>www.mozilla.org</code> — group1, origin2</li> + <li><code>joe.blogs.mozilla.org</code> — group1, origin3</li> + <li><code>firefox.com</code> — group2, origin4</li> +</ul> + +<p>In this group, <code>mozilla.org</code>, <code>www.mozilla.org</code>, and <code>joe.blogs.mozilla.org</code> can aggregately use a maximum of 20% of the global limit. <code>firefox.com</code> has a separate maximum of 20%.</p> + +<p>The two limits react differently to limits being reached:</p> + +<ul> + <li>The group limit is also called the "hard limit": it doesn't trigger origin eviction.</li> + <li>The global limit is a "soft limit" since there's a chance that some space will be freed and the operation can continue.</li> +</ul> + +<div class="note"> +<p><strong>Note</strong>: The group limit can't be more than the global limit, despite the minimum group limit mentioned above. If you had a really low memory situation where the global limit was, say, 8 MB, then the group limit would also be 8 MB.</p> +</div> + +<div class="note"> +<p><strong>Note</strong>: If the group limit is exceeded, or if origin eviction couldn't free enough space, the browser will throw a <code>QuotaExceededError</code>.</p> +</div> + +<div class="note"> +<p><strong>Note</strong>: In Chrome the soft and hard storage quota limits has changed since <strong>M66</strong>. More information can be found <a href="https://chromium.googlesource.com/chromium/src/+/refs/heads/master/storage/browser/quota/quota_settings.cc#68">here.</a></p> +</div> + +<h2 id="LRU_policy">LRU policy</h2> + +<p>When the available disk space is filled up, the quota manager will start clearing out data based on an LRU policy — the least recently used origin will be deleted first, then the next one, until the browser is no longer over the limit.</p> + +<p>We track the "last access time" for each origin using temporary storage. Once the global limit for temporary storage is reached (more on the limit later), we try to find all currently unused origins (i.e., ones with no tabs/apps open that are keeping open datastores). These are then sorted according to "last access time." The least recently used origins are then deleted until there's enough space to fulfill the request that triggered this origin eviction.</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="http://www.html5rocks.com/en/tutorials/offline/quota-research/">Working with quota on mobile browsers</a>, by<a href="http://blog.agektmr.com" title="Eiji Kitamura"> Eiji Kitamura.</a> A detailed analysis of client-side storage on mobile browsers.</li> + <li><a href="https://developers.google.com/web/updates/2011/11/Quota-Management-API-Fast-Facts">Quota Management API: Fast Facts</a>, by<a href="http://blog.agektmr.com" title="Eiji Kitamura"> Eiji Kitamura.</a> A look at the Quota Management API in Chrome/Blink (which should include Opera, too).</li> +</ul> diff --git a/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html b/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html index 1278783254..e49f1183b8 100644 --- a/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html @@ -22,7 +22,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <div id="onedtwod"> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -40,7 +40,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div>One</div> <div>Two</div> <div>Three</div> @@ -49,7 +49,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: flex; flex-wrap: wrap; } @@ -65,13 +65,13 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>Общий вопрос заключается в том, как заставить наши перебежавшие элементы выравняться по элементам сверху. Как раз в этом случае и нужен метод размещения элементов в двумерной системе: требуется выравнивание и по строке, и по колонке, а для этого на помощь спешит Grid.</p> -<h3 id="Те_же_яйца_вид_в_профиль_тот_же_макет_но_с_CSS_гридами">Те же яйца, вид в профиль: тот же макет, но с CSS гридами</h3> +<h3 id="Тот_же_макет_но_с_CSS_гридами">Тот же макет, но с CSS гридами</h3> -<p>В примере ниже мы создаем тот же самый макет, но используя гриды. На этот раз у нас три трека-колонки шириной в <code>1fr</code> . И при этом нам не требуется задавать какие-либо свойства дочерним элементам, потому что они самостоятельно занимают по одной ячейке созданного грида. Как Вы видите, наши элементы лежат в жесткой сетке и выравниваются и по строке, и по колонке. Поскольку у нас пять элементов, в результате мы получаем пустую ячейку в конце второй строки. </p> +<p>В примере ниже мы создаем тот же самый макет, но используя гриды. На этот раз у нас три трека-колонки шириной в <code>1fr</code> . И при этом нам не требуется задавать какие-либо свойства дочерним элементам, потому что они самостоятельно занимают по одной ячейке созданного грида. Как видите, наши элементы лежат в жесткой сетке и выравниваются и по строке, и по колонке. Поскольку у нас пять элементов, в результате мы получаем пустую ячейку в конце второй строки. </p> <div class="Two_Dimensional_With_Grid"> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -89,7 +89,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div>One</div> <div>Two</div> <div>Three</div> @@ -98,7 +98,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(3, 1fr); } @@ -107,11 +107,11 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>{{ EmbedLiveSample('Two_Dimensional_With_Grid', '300', '170') }}</p> </div> -<p>Если Вы колеблетесь, что выбрать - flexbox или грид, задайте себе простой вопрос:</p> +<p>Если Вы колеблетесь, что выбрать - flexbox или grid, задайте себе простой вопрос:</p> <ul> - <li>мне нужно управлять размещением элементов в строке <u>или </u>в колонке - окей, нужен flexbox</li> - <li>мне нужно управлять размещением элементов <u>и </u>в строке, <u>и </u>в колонке – окей, нужен грид</li> + <li>нужно управлять размещением элементов в строке <em><u>или</u></em> в колонке - используем flexbox</li> + <li>нужно управлять размещением элементов в строке <em><u>и</u></em> в колонке – используем grid</li> </ul> <h3 id="Что_важнее_контент_или_макет">Что важнее: контент или макет?</h3> @@ -133,7 +133,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>В первом примере, использующем flexbox, у нас есть контейнер с тремя элементами. Для блока-обертки wrapper установлено свойство {{cssxref("min-height")}}, и оно задает высоту flex-контейнера. Мы установили свойство {{cssxref("align-items")}} flex-контейнера в значение <code>flex-end</code> , поэтому элементы выравниваются по концу flex-контейнера. Мы также установили значение свойства {{cssxref("align-self")}} для <code>box1</code> таким образом, что оно перезапишет поведение по умолчанию и заставит наш блок растянутся на всю высоту контейнера. Для <code>box2</code> свойство {{cssxref("align-self")}} установлено таким образом, что блок перепрыгнет в начало flex-контейнера.</p> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -151,14 +151,14 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div class="box1">One</div> <div class="box2">Two</div> <div class="box3">Three</div> </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: flex; align-items: flex-end; min-height: 200px; @@ -178,7 +178,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>Второй пример использует грид, чтобы создать тот же самый макет, и на этот раз мы рассмотрим то, как свойства выравнивания блоков применяются к гридам. Вместо <code>flex-start</code> и <code>flex-end</code> мы задаем <code>start</code> и <code>end</code> . В случае с макетом на гридах мы выравниваем элементы внутри их грид-области, в данном примере - это одна единственная грид-ячейка, но в целом грид-область может состоять из нескольких грид-ячеек.</p> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -196,14 +196,14 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div class="box1">One</div> <div class="box2">Two</div> <div class="box3">Three</div> </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(3,1fr); align-items: end; @@ -233,7 +233,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>В примере ниже мы используем ключевое слово <code>auto-fill</code> вместо целого числа в repeat-нотации и задаем структуру треков размером в 200 пикселей. Это значит, что грид создаст столько треков-колонок размером в 200 пикселей, сколько их может разместиться в контейнере.</p> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -251,14 +251,14 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div>One</div> <div>Two</div> <div>Three</div> </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(auto-fill, 200px); } @@ -271,7 +271,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>Давайте вспомним пример с flexbox, когда элементы, размер которых больше 200 пикселей, переходят на новую строку. Тот же самый эффект в гридах мы можем получить комбинируя <code>auto-fill</code> и функцию {{cssxref("minmax", "minmax()")}}. В примере ниже мы создаем автозаполненные треки с помощью <code>minmax</code>. Мы хотим, чтобы треки были как минимум 200 пикселей в ширину, это наше минимальное значение, а для максимального зададим <code>1fr</code>. В процессе, когда браузер вычисляет, сколько блоков в 200 пикселей может разместиться в контейнере - при этом учитывая грид-зазоры - он расценивает максимум <code>1fr</code> как инструкцию распределить оставшееся свободное пространство между этими блоками.</p> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -289,14 +289,14 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div>One</div> <div>Two</div> <div>Three</div> </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } @@ -317,7 +317,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>В примере ниже у нас есть блок-обертка с четырьмя дочерними элементами. Третий элемент абсолютно позиционирован и одновременно размещен в гриде с помощью привязки к грид-линиям. У грид-контейнера <code>position:</code> <code>relative</code> , поэтому он становится контекстом позиционирования для нашего третьего элемента.</p> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -335,7 +335,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div class="box1">One</div> <div class="box2">Two</div> <div class="box3"> @@ -346,7 +346,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(4,1fr); grid-auto-rows: 200px; @@ -385,7 +385,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>Задаем <code>.box3</code> свойство position в значении relative и затем перемещаем наш под-элемент с помощью свойств сдвига. В данном случае контекстом позиционирования является грид-область.</p> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -403,7 +403,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div class="box1">One</div> <div class="box2">Two</div> <div class="box3">Three @@ -415,7 +415,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(4,1fr); grid-auto-rows: 200px; @@ -453,7 +453,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <div id="Display_Contents_Before"> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -477,7 +477,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div class="box box1"> <div class="nested">a</div> <div class="nested">b</div> @@ -490,7 +490,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(100px, auto); @@ -509,7 +509,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <div id="Display_Contents_After"> <div class="hidden"> -<pre class="brush: css">* {box-sizing: border-box;} +<pre class="brush: css notranslate">* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; @@ -533,7 +533,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </pre> </div> -<pre class="brush: html"><div class="wrapper"> +<pre class="brush: html notranslate"><div class="wrapper"> <div class="box box1"> <div class="nested">a</div> <div class="nested">b</div> @@ -546,7 +546,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout </div> </pre> -<pre class="brush: css">.wrapper { +<pre class="brush: css notranslate">.wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(100px, auto); diff --git a/files/ru/web/css/vertical-align/index.html b/files/ru/web/css/vertical-align/index.html index c7e311b39a..45662b41ce 100644 --- a/files/ru/web/css/vertical-align/index.html +++ b/files/ru/web/css/vertical-align/index.html @@ -5,9 +5,9 @@ translation_of: Web/CSS/vertical-align --- <div>{{CSSRef}}</div> -<p>Свойство <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> <code>vertical-align</code> описывает вертикальное позиционирование строчных элементов (inline) или ячеек таблицы (table-cell).</p> +<p>Свойство <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> <code>vertical-align</code> описывает вертикальное позиционирование строчных (inline), строчно-блочных (inline-block) элементов или ячеек таблицы (table-cell).</p> -<pre class="brush: css no-line-numbers">/* ключевые значения */ +<pre class="brush: css no-line-numbers notranslate">/* ключевые значения */ vertical-align: baseline; vertical-align: sub; vertical-align: super; @@ -37,7 +37,7 @@ vertical-align: unset; </ul> <div id="vertical-align-inline"> -<pre class="hidden brush: html"><p> +<pre class="hidden brush: html notranslate"><p> top:<img style="vertical-align:top" src="https://mdn.mozillademos.org/files/15189/star.png"/> middle:<img style="vertical-align:middle" src="https://mdn.mozillademos.org/files/15189/star.png"/> bottom:<img style="vertical-align:bottom" src="https://mdn.mozillademos.org/files/15189/star.png"/> @@ -55,7 +55,7 @@ text-bottom:<img style="vertical-align:text-bottom" src="https://mdn.mozilla </pre> -<pre class="hidden brush: css">#* { +<pre class="hidden brush: css notranslate">#* { box-sizing: border-box; } @@ -82,7 +82,7 @@ p { </ul> <div id="vertical-align-table"> -<pre class="hidden brush: html"><table> +<pre class="hidden brush: html notranslate"><table> <tr> <td style="vertical-align: baseline">baseline</td> <td style="vertical-align: top">top</td> @@ -92,7 +92,7 @@ p { <p>Существует теория, которая утверждает, что если однажды кто-нибудь доподлинно выяснит, что такое и для чего нужна Вселенная, она тотчас же исчезнет, и вместо нее появится нечто еще более причудливое и необъяснимое.</p> <p>Существует и другая теория, согласно которой это уже случилось.</p></pre> -<pre class="hidden brush: css">table { +<pre class="hidden brush: css notranslate">table { margin-left: auto; margin-right: auto; width: 80%; @@ -176,13 +176,13 @@ td { <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +<pre class="syntaxbox notranslate">{{csssyntax}}</pre> <h2 id="Пример">Пример</h2> <h3 id="HTML">HTML</h3> -<pre class="brush: html"><div>Изображение <img src="https://mdn.mozillademos.org/files/12245/frame_image.svg" alt="link" width="32" height="32" /> с выравниванием по умолчанию.</div> +<pre class="brush: html notranslate"><div>Изображение <img src="https://mdn.mozillademos.org/files/12245/frame_image.svg" alt="link" width="32" height="32" /> с выравниванием по умолчанию.</div> <div>Изображение <img class="top" src="https://mdn.mozillademos.org/files/12245/frame_image.svg" alt="link" width="32" height="32" /> с выравниванием по верхнему краю.</div> <div>Изображение <img class="bottom" src="https://mdn.mozillademos.org/files/12245/frame_image.svg" alt="link" width="32" height="32" /> с выравниванием по нижнему краю.</div> <div>Изображение <img class="middle" src="https://mdn.mozillademos.org/files/12245/frame_image.svg" alt="link" width="32" height="32" /> с выравниванием по центру.</div> @@ -190,7 +190,7 @@ td { <h3 id="CSS">CSS</h3> -<pre class="brush: css">img.top { vertical-align: text-top; } +<pre class="brush: css notranslate">img.top { vertical-align: text-top; } img.bottom { vertical-align: text-bottom; } img.middle { vertical-align: middle; } </pre> diff --git a/files/ru/web/http/заголовки/accept-ranges/index.html b/files/ru/web/http/заголовки/accept-ranges/index.html index b8f63b9d0e..6637d01bbf 100644 --- a/files/ru/web/http/заголовки/accept-ranges/index.html +++ b/files/ru/web/http/заголовки/accept-ranges/index.html @@ -1,6 +1,10 @@ --- title: Accept-Ranges slug: Web/HTTP/Заголовки/Accept-Ranges +tags: + - HTTP + - HTTP Заголовок + - заголовок ответа translation_of: Web/HTTP/Headers/Accept-Ranges --- <div>{{HTTPSidebar}}</div> @@ -24,7 +28,7 @@ translation_of: Web/HTTP/Headers/Accept-Ranges <h2 id="Синтаксис">Синтаксис</h2> -<pre class="syntaxbox">Accept-Ranges: bytes +<pre class="syntaxbox notranslate">Accept-Ranges: bytes Accept-Ranges: none</pre> <h2 id="Указания">Указания</h2> @@ -40,7 +44,7 @@ Accept-Ranges: none</pre> <h2 id="Примеры">Примеры</h2> -<pre>Accept-Ranges: bytes +<pre class="notranslate">Accept-Ranges: bytes </pre> <h2 id="Спецификации">Спецификации</h2> @@ -69,4 +73,5 @@ Accept-Ranges: none</pre> <ul> <li>{{HTTPHeader("If-Range")}}</li> <li>{{HTTPHeader("Range")}}</li> + <li><a href="https://www.iana.org/assignments/http-parameters/http-parameters.xhtml#range-units">IANA HTTP Range Unit Registry</a></li> </ul> diff --git a/files/ru/web/javascript/reference/global_objects/number/toexponential/index.html b/files/ru/web/javascript/reference/global_objects/number/toexponential/index.html index 0f24f36542..b9dac9b104 100644 --- a/files/ru/web/javascript/reference/global_objects/number/toexponential/index.html +++ b/files/ru/web/javascript/reference/global_objects/number/toexponential/index.html @@ -11,23 +11,30 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toExponential <div>{{JSRef("Global_Objects", "Number")}}</div> <h2 id="Summary" name="Summary">Сводка</h2> + <p>Метод <strong><code>toExponential()</code></strong> возвращает строку, представляющую объект {{jsxref("Global_Objects/Number", "Number")}} в экспоненциальной записи.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> -<pre class="syntaxbox"><code><var>numObj</var>.toExponential([<var>fractionDigits</var>])</code></pre> + +<pre class="syntaxbox notranslate"><code><var>numObj</var>.toExponential([<var>fractionDigits</var>])</code></pre> <h3 id="Parameters" name="Parameters">Параметры</h3> + <dl> <dt><code>fractionDigits</code></dt> <dd>Необязательный параметр. Целое число, определяющее количество цифр после десятичной запятой. По умолчанию используется столько цифр, сколько необходимо для указания числа.</dd> </dl> <h3 id="Returns" name="Returns">Возвращаемое значение</h3> + <p>Строка, представляющая объект {{jsxref("Global_Objects/Number", "Number")}} в экспоненциальной записи с одной цифрой перед десятичной запятой, округлённое до <code>fractionDigits</code> цифр после десятичной запятой. Если аргумент <code>fractionDigits</code> опущен, количество цифр после десятичной запятой по умолчанию устанавливается в количество цифр, необходимых для однозначного представления значения.</p> + <p>Если вы используете метод <code>toExponential()</code> с числовыми литералами и числовой литерал не имеет экспоненты и десятичной запятой, оставьте пробел перед точкой, предшествующей вызову метода для предотвращения интерпретации этой точки как десятичной запятой.</p> + <p>Если число имеет больше цифр, чем запрошено параметром <code>fractionDigits</code>, оно будет округлено к ближайшему числу, представляемому <code>fractionDigits</code> цифрами. Смотрите обсуждение округления в описании метода {{jsxref("Number.prototype.toFixed", "toFixed()")}}, которое так же применяется и к методу <code>toExponential()</code>.</p> <h3 id="Throws" name="Throws">Выбрасываемые исключения</h3> + <dl> <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt> <dd>Если параметр <code>fractionDigits</code> слишком маленький или слишком большой. Значения между 0 и 20 включительно не будут порождать исключение {{jsxref("Global_Objects/RangeError", "RangeError")}}. Также реализации могут поддерживать большие и меньшие значения.</dd> @@ -37,8 +44,9 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toExponential <h2 id="Examples" name="Examples">Примеры</h2> -<h3 id="Example:_Using_toExponential" name="Example:_Using_toExponential">Пример: использование <code>toExponential</code></h3> -<pre class="brush: js">var numObj = 77.1234; +<h3 id="Example_Using_toExponential" name="Example:_Using_toExponential">Пример: использование <code>toExponential</code></h3> + +<pre class="brush: js notranslate">var numObj = 77.1234; console.log(numObj.toExponential()); // выведет 7.71234e+1 @@ -49,6 +57,7 @@ console.log(77 .toExponential()); // выведет 7.7e+1 </pre> <h2 id="Specifications" name="Specifications">Спецификации</h2> + <table class="standard-table"> <tbody> <tr> @@ -64,66 +73,22 @@ console.log(77 .toExponential()); // выведет 7.7e+1 <tr> <td>{{SpecName('ES5.1', '#sec-15.7.4.6', 'Number.prototype.toExponential')}}</td> <td>{{Spec2('ES5.1')}}</td> - <td> </td> + <td></td> </tr> <tr> <td>{{SpecName('ES6', '#sec-number.prototype.toexponential', 'Number.prototype.toExponential')}}</td> <td>{{Spec2('ES6')}}</td> - <td> </td> + <td></td> </tr> </tbody> </table> <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> -<div>{{CompatibilityTable}}</div> -<div id="compat-desktop"> - <table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> - </table> -</div> -<div id="compat-mobile"> - <table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Android</th> - <th>Chrome для Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> - </table> -</div> + +<div>{{Compat("javascript.builtins.Number.toExponential")}}</div> <h2 id="See_also" name="See_also">Смотрите также</h2> + <ul> <li>{{jsxref("Number.prototype.toFixed()")}}</li> <li>{{jsxref("Number.prototype.toPrecision()")}}</li> diff --git a/files/ru/web/javascript/reference/global_objects/number/tofixed/index.html b/files/ru/web/javascript/reference/global_objects/number/tofixed/index.html index a7beb2afcc..9ea23419b6 100644 --- a/files/ru/web/javascript/reference/global_objects/number/tofixed/index.html +++ b/files/ru/web/javascript/reference/global_objects/number/tofixed/index.html @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed <h2 id="Syntax" name="Syntax">Синтаксис</h2> -<pre class="syntaxbox"><code><var>numObj</var>.toFixed([<var>digits</var>])</code></pre> +<pre class="syntaxbox notranslate"><code><var>numObj</var>.toFixed([<var>digits</var>])</code></pre> <h3 id="Parameters" name="Parameters">Параметры</h3> @@ -40,9 +40,9 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed <h2 id="Examples" name="Examples">Примеры</h2> -<h3 id="Example:_Using_toFixed" name="Example:_Using_toFixed">Пример: использование <code>toFixed</code></h3> +<h3 id="Example_Using_toFixed" name="Example:_Using_toFixed">Пример: использование <code>toFixed</code></h3> -<pre class="brush: js">var numObj = 12345.6789; +<pre class="brush: js notranslate">var numObj = 12345.6789; numObj.toFixed(); // Вернёт '12346': обратите внимание на округление, дробной части нет numObj.toFixed(1); // Вернёт '12345.7': обратите внимание на округление @@ -72,67 +72,19 @@ numObj.toFixed(6); // Вернёт '12345.678900': обратите вни <tr> <td>{{SpecName('ES5.1', '#sec-15.7.4.5', 'Number.prototype.toFixed')}}</td> <td>{{Spec2('ES5.1')}}</td> - <td> </td> + <td></td> </tr> <tr> <td>{{SpecName('ES6', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}</td> <td>{{Spec2('ES6')}}</td> - <td> </td> + <td></td> </tr> </tbody> </table> <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Android</th> - <th>Chrome для Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> +<div>{{Compat("javascript.builtins.Number.toFixed")}}</div> <h2 id="See_also" name="See_also">Смотрите также</h2> diff --git a/files/ru/web/javascript/reference/global_objects/number/toprecision/index.html b/files/ru/web/javascript/reference/global_objects/number/toprecision/index.html index 83157bf3d2..2485692ca8 100644 --- a/files/ru/web/javascript/reference/global_objects/number/toprecision/index.html +++ b/files/ru/web/javascript/reference/global_objects/number/toprecision/index.html @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toPrecision <h2 id="Syntax" name="Syntax">Синтаксис</h2> -<pre class="syntaxbox"><code><var>numObj</var>.toPrecision([<var>precision</var>])</code></pre> +<pre class="syntaxbox notranslate"><code><var>numObj</var>.toPrecision([<var>precision</var>])</code></pre> <h3 id="Parameters" name="Parameters">Параметры</h3> @@ -42,7 +42,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toPrecision <h3 id="Example_Using_toPrecision" name="Example:_Using_toPrecision">Пример: использование <code>toPrecision</code></h3> -<pre class="brush: js">var numObj = 5.123456; +<pre class="brush: js notranslate">var numObj = 5.123456; console.log(numObj.toPrecision()); // выведет '5.123456' console.log(numObj.toPrecision(5)); // выведет '5.1235' @@ -91,55 +91,7 @@ console.log((1234.5).toPrecision(2)); // выведет '1.2e+3' <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Android</th> - <th>Chrome для Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> +<div>{{Compat("javascript.builtins.Number.toPrecision")}}</div> <h2 id="See_also" name="See_also">Смотрите также</h2> diff --git a/files/ru/web/javascript/reference/global_objects/number/tostring/index.html b/files/ru/web/javascript/reference/global_objects/number/tostring/index.html index e3bfee048a..47bd43c2a8 100644 --- a/files/ru/web/javascript/reference/global_objects/number/tostring/index.html +++ b/files/ru/web/javascript/reference/global_objects/number/tostring/index.html @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toString <h2 id="Syntax" name="Syntax">Синтаксис</h2> -<pre class="syntaxbox"><code><var>numObj</var>.toString([<var>radix</var>])</code></pre> +<pre class="syntaxbox notranslate"><code><var>numObj</var>.toString([<var>radix</var>])</code></pre> <h3 id="Parameters" name="Parameters">Параметры</h3> @@ -44,9 +44,9 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toString <h2 id="Examples" name="Examples">Примеры</h2> -<h3 id="Example:_Using_toString" name="Example:_Using_toString">Пример: использование <code>toString</code></h3> +<h3 id="Example_Using_toString" name="Example:_Using_toString">Пример: использование <code>toString</code></h3> -<pre class="brush: js">var count = 10; +<pre class="brush: js notranslate">var count = 10; console.log(count.toString()); // Выведет '10' console.log((17).toString()); // Выведет '17' @@ -89,55 +89,7 @@ console.log((-0xff).toString(2)); // Выведет '-11111111' <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Возможность</th> - <th>Android</th> - <th>Chrome для Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Базовая поддержка</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> +<div>{{Compat("javascript.builtins.Number.toString")}}</div> <h2 id="See_also" name="See_also">Смотрите также</h2> diff --git a/files/ru/web/performance/dns-prefetch/index.html b/files/ru/web/performance/dns-prefetch/index.html index 56002153ce..d6575dcf2a 100644 --- a/files/ru/web/performance/dns-prefetch/index.html +++ b/files/ru/web/performance/dns-prefetch/index.html @@ -11,7 +11,7 @@ translation_of: Web/Performance/dns-prefetch <h2 id="Зачем_использовать_dns-prefetch">Зачем использовать dns-prefetch?</h2> -<p>Бывают случаи, когда в вашем приложении использются ссылки на домены, отличные от основного домена приложения. Например, внутри вашего приложения на "a.com" есть ссылка на домен "b.org". Для того, чтобы пройти по этой ссылке, пользовательский клиент должен сначала выяснить, какой адрес в интернете соответствует доменному имени "b.org". Этот процесс называется <code>DNS resolution.</code> И хотя механизмы кеширования DNS помогают сократить время запросов, DNS Resolution заметно влияет на время ожидания запроса из-за того, что первый клиентский запрос уходит сначала на DNS сервера и дожидается ответа от них. Для приложений, которые открывают соединения ко многим сторонним доменам, влияние DNS Resolution может сильно уменьшить производительность загрузки.</p> +<p>Бывают случаи, когда в вашем приложении используются ссылки на домены, отличные от основного домена приложения. Например, внутри вашего приложения на "a.com" есть ссылка на домен "b.org". Для того, чтобы пройти по этой ссылке, пользовательский клиент должен сначала выяснить, какой адрес в интернете соответствует доменному имени "b.org". Этот процесс называется <code>DNS resolution.</code> И хотя механизмы кеширования DNS помогают сократить время запросов, DNS Resolution заметно влияет на время ожидания запроса из-за того, что первый клиентский запрос уходит сначала на DNS сервера и дожидается ответа от них. Для приложений, которые открывают соединения ко многим сторонним доменам, влияние DNS Resolution может сильно уменьшить производительность загрузки.</p> <p><code>dns-prefetch</code> помогает разработчикам замаскировать ожидание DNS resolution. <a href="/en-US/docs/Web/HTML/Element/link">HTML <code><link></code> элемент</a> предлагает подобный функционал с помощью атрибута <a href="/en-US/docs/Web/HTML/Attributes/rel"><code>rel</code></a>, значение которого может содержать <code>dns-prefetch</code>. В этом случае, предзагрузка DNS произойдет для домена, указанного в атрибуте <a href="/en-US/docs/Web/HTML/Attributes">href</a>:</p> |