Skip to content

Commit 9ba4194

Browse files
authored
👾 Smth
1 parent c64d6e3 commit 9ba4194

File tree

18 files changed

+39
-39
lines changed

18 files changed

+39
-39
lines changed

2-ui/1-document/04-searching-elements-dom/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@
115115
## matches
116116
Предыдущие методы искали по DOM.
117117

118-
Метод [elem.matches(css)](http://dom.spec.whatwg.org/#dom-element-matches) ничего не ищет, а проверяет, удовлетворяет ли `elem` CSS-селектору, и возвращает `true` или `false`.
118+
Метод [elem.matches(css)](https://dom.spec.whatwg.org/#dom-element-matches) ничего не ищет, а проверяет, удовлетворяет ли `elem` CSS-селектору, и возвращает `true` или `false`.
119119

120120
Этот метод удобен, когда мы перебираем элементы (например, в массиве или в чём-то подобном) и пытаемся выбрать те из них, которые нас интересуют.
121121

2-ui/1-document/05-basic-dom-node-properties/article.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010

1111
Каждый DOM-узел принадлежит соответствующему встроенному классу.
1212

13-
Корнем иерархии является [EventTarget](https://dom.spec.whatwg.org/#eventtarget), от него наследует [Node](http://dom.spec.whatwg.org/#interface-node) и остальные DOM-узлы.
13+
Корнем иерархии является [EventTarget](https://dom.spec.whatwg.org/#eventtarget), от него наследует [Node](https://dom.spec.whatwg.org/#interface-node) и остальные DOM-узлы.
1414

1515
На рисунке ниже изображены основные классы:
1616

@@ -19,8 +19,8 @@
1919
Существуют следующие классы:
2020

2121
- [EventTarget](https://dom.spec.whatwg.org/#eventtarget) -- это корневой "абстрактный" класс. Объекты этого класса никогда не создаются. Он служит основой, благодаря которой все DOM-узлы поддерживают так называемые "события", о которых мы поговорим позже.
22-
- [Node](http://dom.spec.whatwg.org/#interface-node) -- также является "абстрактным" классом, и служит основой для DOM-узлов. Он обеспечивает базовую функциональность: `parentNode`, `nextSibling`, `childNodes` и т.д. (это геттеры). Объекты класса `Node` никогда не создаются. Но есть определённые классы узлов, которые наследуют от него: `Text` -- для текстовых узлов, `Element` -- для узлов-элементов и более экзотический `Comment` -- для узлов-комментариев.
23-
- [Element](http://dom.spec.whatwg.org/#interface-element) -- это базовый класс для DOM-элементов. Он обеспечивает навигацию на уровне элементов: `nextElementSibling`, `children` и методы поиска: `getElementsByTagName`, `querySelector`. Браузер поддерживает не только HTML, но также XML и SVG. Класс Element служит базой для следующих классов: `SVGElement`, `XMLElement` и `HTMLElement`.
22+
- [Node](https://dom.spec.whatwg.org/#interface-node) -- также является "абстрактным" классом, и служит основой для DOM-узлов. Он обеспечивает базовую функциональность: `parentNode`, `nextSibling`, `childNodes` и т.д. (это геттеры). Объекты класса `Node` никогда не создаются. Но есть определённые классы узлов, которые наследуют от него: `Text` -- для текстовых узлов, `Element` -- для узлов-элементов и более экзотический `Comment` -- для узлов-комментариев.
23+
- [Element](https://dom.spec.whatwg.org/#interface-element) -- это базовый класс для DOM-элементов. Он обеспечивает навигацию на уровне элементов: `nextElementSibling`, `children` и методы поиска: `getElementsByTagName`, `querySelector`. Браузер поддерживает не только HTML, но также XML и SVG. Класс Element служит базой для следующих классов: `SVGElement`, `XMLElement` и `HTMLElement`.
2424
- [HTMLElement](https://html.spec.whatwg.org/multipage/dom.html#htmlelement) -- является базовым классом для всех остальных HTML-элементов. От него наследуют конкретные элементы:
2525
- [HTMLInputElement](https://html.spec.whatwg.org/multipage/forms.html#htmlinputelement) -- класс для тега `<input>`,
2626
- [HTMLBodyElement](https://html.spec.whatwg.org/multipage/semantics.html#htmlbodyelement) -- класс для тега `<body>`,

2-ui/1-document/06-dom-attributes-and-properties/2-yellow-links/solution.view/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@
44

55
<a name="list">The list:</a>
66
<ul>
7-
<li><a href="http://google.com">http://google.com</a></li>
7+
<li><a href="https://google.com">https://google.com</a></li>
88
<li><a href="/tutorial">/tutorial.html</a></li>
99
<li><a href="local/path">local/path</a></li>
1010
<li><a href="ftp://ftp.com/my.zip">ftp://ftp.com/my.zip</a></li>
11-
<li><a href="http://nodejs.org">http://nodejs.org</a></li>
11+
<li><a href="https://nodejs.org">https://nodejs.org</a></li>
1212
<li><a href="http://internal.com/test">http://internal.com/test</a></li>
1313
</ul>
1414

2-ui/1-document/06-dom-attributes-and-properties/2-yellow-links/source.view/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@
44

55
<a name="list">The list:</a>
66
<ul>
7-
<li><a href="http://google.com">http://google.com</a></li>
7+
<li><a href="https://google.com">https://google.com</a></li>
88
<li><a href="/tutorial">/tutorial.html</a></li>
99
<li><a href="local/path">local/path</a></li>
1010
<li><a href="ftp://ftp.com/my.zip">ftp://ftp.com/my.zip</a></li>
11-
<li><a href="http://nodejs.org">http://nodejs.org</a></li>
11+
<li><a href="https://nodejs.org">https://nodejs.org</a></li>
1212
<li><a href="http://internal.com/test">http://internal.com/test</a></li>
1313
</ul>
1414

2-ui/2-events/02-bubbling-and-capturing/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@
120120

121121
Существует ещё одна фаза из жизненного цикла события -- "погружение" (иногда её называют "перехват"). Она очень редко используется в реальном коде, однако тоже может быть полезной.
122122

123-
Стандарт [DOM Events](http://www.w3.org/TR/DOM-Level-3-Events/) описывает 3 фазы прохода события:
123+
Стандарт [DOM Events](https://www.w3.org/TR/DOM-Level-3-Events/) описывает 3 фазы прохода события:
124124

125125
1. Фаза погружения (capturing phase) -- событие сначала идёт сверху вниз.
126126
2. Фаза цели (target phase) -- событие достигло целевого(исходного) элемента.

2-ui/2-events/05-dispatch-events/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88

99
## Конструктор Event
1010

11-
Встроенные классы для событий формируют иерархию аналогично классам для DOM-элементов. Её корнем является встроенный класс [Event](http://www.w3.org/TR/dom/#event).
11+
Встроенные классы для событий формируют иерархию аналогично классам для DOM-элементов. Её корнем является встроенный класс [Event](https://dom.spec.whatwg.org/#event).
1212

1313
Событие встроенного класса `Event` можно создать так:
1414

20-css-for-js/1-css-why/article.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -43,17 +43,17 @@
4343
- Приоритет селекторов
4444
- Селекторы `#id`, `.class`, `a > b`
4545

46-
- Сброс браузерных стилей, <a href="http://meyerweb.com/eric/tools/css/reset/">reset.css</a>
46+
- Сброс браузерных стилей, <a href="https://meyerweb.com/eric/tools/css/reset/">reset.css</a>
4747

4848
## Почитать
4949

5050
Книжек много, но хороших -- как всегда, мало.
5151

5252
С уверенностью могу рекомендовать следующие:
5353

54-
- <a href="http://www.ozon.ru/context/detail/id/24493075/?partner=iliakan">Большая книга CSS3.</a>
54+
- <a href="https://www.ozon.ru/context/detail/id/24493075/?partner=iliakan">Большая книга CSS3.</a>
5555
<i>Дэвид Макфарланд.</i>
56-
- <a href="http://www.ozon.ru/context/detail/id/3881079/?partner=iliakan">CSS. Каскадные таблицы стилей. Подробное руководство.</a>
56+
- <a href="https://www.ozon.ru/context/detail/id/3881079/?partner=iliakan">CSS. Каскадные таблицы стилей. Подробное руководство.</a>
5757
<i>Эрик Мейер</i>
5858
- <a href="https://debuggingcss.com/">Отладка CSS</a>
5959
<i>Ахмад Шадид</i>

20-css-for-js/11-margin/1-failing-margins/solution.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
Ошибка заключается в том, что `margin` при задании в процентах высчитывается *относительно ширины*. Так написано [в стандарте](http://www.w3.org/TR/CSS2/box.html#margin-properties).
1+
Ошибка заключается в том, что `margin` при задании в процентах высчитывается *относительно ширины*. Так написано [в стандарте](https://www.w3.org/TR/CSS2/box.html#margin-properties).
22

33
При этом не важно, какой отступ: левый, правый. верхний или нижний. Все они в процентах отсчитываются от ширины. Из-за этого и ошибка.
44

20-css-for-js/11-margin/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -166,5 +166,5 @@ hr.position { position: relative; left: -2em; }
166166
- Отрицательные `margin-left/top` сдвигают элемент влево-вверх. Остальные элементы это учитывают, в отличие от сдвига через `position`.
167167
- Отрицательные `margin-right/bottom` заставляют другие элементы думать, что блок меньше по размеру справа-внизу, чем он на самом деле.
168168

169-
Отличная статья на тему отрицательных `margin`: [The Definitive Guide to Using Negative Margins](http://coding.smashingmagazine.com/2009/07/27/the-definitive-guide-to-using-negative-margins/)
169+
Отличная статья на тему отрицательных `margin`: [The Definitive Guide to Using Negative Margins](https://coding.smashingmagazine.com/2009/07/27/the-definitive-guide-to-using-negative-margins/)
170170

20-css-for-js/12-space-under-img/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@
6565
6666
А что, если мы, по каким-то причинам, *не хотим* делать элемент блочным?
6767
68-
Существует ещё один способ избежать проблемы -- использовать свойство [vertical-align](http://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align).
68+
Существует ещё один способ избежать проблемы -- использовать свойство [vertical-align](https://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align).
6969
7070
**Если установить `vertical-align` в `top`, то инлайн-элемент будет отпозиционирован по верхней границе текущей строки.**
7171

20-css-for-js/14-height-percent/article.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -69,13 +69,13 @@ CSS:
6969

7070
Как видно, блок со стрелкой вообще исчез! Куда же он подевался?
7171

72-
Ответ нам даст спецификация CSS 2.1 [пункт 10.5](http://www.w3.org/TR/CSS2/visudet.html#propdef-height).
72+
Ответ нам даст спецификация CSS 2.1 [пункт 10.5](https://www.w3.org/TR/CSS2/visudet.html#propdef-height).
7373

7474
**"Если высота внешнего блока вычисляется по содержимому, то высота в % не работает, и заменяется на `height:auto`. Кроме случая, когда у элемента стоит `position:absolute`."**
7575

7676
В нашем случае высота `.container` как раз определяется по содержимому, поэтому для `.toggler` проценты не действуют, а размер вычисляется как при `height:auto`.
7777

78-
Какая же она -- эта автоматическая высота? Вспоминаем, что обычно размеры `float` определяются по содержимому ([10.3.5](http://www.w3.org/TR/CSS2/visudet.html#float-width)). А содержимого-то в `.toggler` нет, так что высота нулевая. Поэтому этот блок и не виден.
78+
Какая же она -- эта автоматическая высота? Вспоминаем, что обычно размеры `float` определяются по содержимому ([10.3.5](https://www.w3.org/TR/CSS2/visudet.html#float-width)). А содержимого-то в `.toggler` нет, так что высота нулевая. Поэтому этот блок и не виден.
7979

8080
Если бы мы точно знали высоту внешнего блока и добавили её в CSS -- это решило бы проблему.
8181

20-css-for-js/17-css-sprite/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -198,4 +198,4 @@ background-position: -90px -40px;
198198
199199
Далее мы встретимся со спрайтами при создании интерфейсов, чтобы кнопка при наведении меняла своё изображение. Один спрайт будет содержать все состояния кнопки, а переключение внешнего вида -- осуществляться при помощи сдвига `background-position`.
200200
201-
Для автоматизированной сборки спрайтов используются специальные инструменты, например <a href="https://github.com/%3C/span%3Ehttp://csssprites.org/%3Cspan%20class="x x-first x-last">">SmartSprites</a>.
201+
Для автоматизированной сборки спрайтов используются специальные инструменты, например [SmartSprites](http://csssprites.org/).

20-css-for-js/18-css-format/article.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ box-shadow:0 0 100px 20px #000;
133133
}
134134
```
135135

136-
CSS-препроцессоры, такие как [SASS](http://sass-lang.com/), [LESS](http://lesscss.org/), [Stylus](http://learnboost.github.com/stylus/), [Autoprefixer](https://github.com/postcss/autoprefixer) делают написание CSS сильно удобнее.
136+
CSS-препроцессоры, такие как [SASS](https://sass-lang.com/), [LESS](https://lesscss.org/), [Stylus](https://learnboost.github.com/stylus/), [Autoprefixer](https://github.com/postcss/autoprefixer) делают написание CSS сильно удобнее.
137137

138138
Выберите один из них и используйте. Единственно, они добавляют дополнительную предобработку CSS, которую нужно учесть, и желательно, на сервере.
139139

0 commit comments

Comments
 (0)