fix(2-1.8): Review Styles and classes article
#533
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ltlaitoff
force-pushed
the
2-1.8-styles-and-classes
branch
from
f9b7470 to
fe8d4e2
Compare
ltlaitoff
commented
Jul 31, 2023
| Якщо ми встановлюємо порожній рядок значенням властивості `style.display`, то браузер звичайним чином застосовує CSS-класи і його вбудовані стилі, так, наче тут взагалі не було такої властивості `style.display`. | ||
| Якщо ми встановлюємо для `style.display` порожній рядок, то браузер застосовує CSS-класи та свої вбудовані стилі нормально, ніби такої властивості як `style.display` взагалі не було. | ||
|
|
||
| Також для цього існує спеціальний метод `elem.style.removeProperty('style property')`. Отже, ми можемо видалити таку властивість наступним чином: |
There was a problem hiding this comment.
From English book version: link
ltlaitoff
commented
Jul 31, 2023
| ``` | ||
|
|
||
| ````warn header="`getComputedStyle` вимагає повної назви властивості" | ||
| Слід завжди запитувати точну назву властивості, значення якої потрібно отримати, як `paddingLeft`, `marginTop` чи `borderTopWidth`. Інакше коректний результат не гарантовано. | ||
|
|
||
| Наприклад, якщо на елементі задано властивості `paddingLeft/paddingTop`, що ми отримаємо, запитавши значення `getComputedStyle(elem).padding`? Нічого, чи може якесь "згенероване" значення наявних полів? Тут немає жодного стандартного правила. | ||
|
|
||
| Також існують інші непослідовності. Для прикладу, деякі браузери (Chrome) покажуть `10px` в документі, наведеному нижче, а інші (Firefox) -- цього не зроблять: |
There was a problem hiding this comment.
Not found it in English book version: link
ltlaitoff
commented
Jul 31, 2023
| [CSS](https://drafts.csswg.org/cssom/#resolved-values) має дві концепції: | ||
|
|
||
| 1. *Обчислене* (*computed*) значення стилю -- це значення після застосування всіх CSS-правил і наслідування, результат CSS-каскаду. Воно може виглядати як `height:1em` чи `font-size:125%`. | ||
| 2. *Вирішене* (*resolved*) значення стилю -- це значення, яке безпосередньо застосовується до елементу. Такі значення, як `1em` чи `125%` -- відносні. Браузер бере обчислене значення, і перераховує все у фіксованих і абсолютних одиницях, наприклад: `height:20px` чи `font-size:16px`. Для геометричних властивостей вирішені значення можуть бути числами з рухомою комою, як от `width:50.5px`. | ||
| 2. *Кінцеве* (*resolved*) значення стилю -- це значення, яке безпосередньо застосовується до елементу. Такі значення, як `1em` чи `125%` -- відносні. Браузер бере обчислене значення, і перераховує все у фіксованих і абсолютних одиницях, наприклад: `height:20px` чи `font-size:16px`. Для геометричних властивостей кінцеві значення можуть бути числами з рухомою комою, як от `width:50.5px`. |
There was a problem hiding this comment.
In my opinion, the translation of `resolved' into Ukrainian as "Кінцеве", although it is not the correct translation, describes it better and more clearly than "Вирішене".
dolgachio
approved these changes
Aug 20, 2023
|
|
||
| Властивість `elem.style` -- це об’єкт, вміст якого відповідає тому, що записано в атрибуті `"style"`. Встановлення `elem.style.width="100px"` працює точнісінько так само, як рядок `width:100px` записаний в атрибут `style`. | ||
|
|
||
| Для властивостей, які називаються кількома словами, використовується верблюдячийРегістр: | ||
| Для властивостей, які називаються кількома словами, використовується верблюдячий регістр (camelCase): |
dolgachio
reviewed
Aug 20, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Зміни для кращої читаємості в 08-styles-and-classes
Зміни робились паралельно звіряючись з Англійською та російською версіями