renovations
This commit is contained in:
Ilya Kantor
parent
8868e87ced
commit
4734796ca0
57 changed files with 998 additions and 749 deletions
|
|
@ -6,9 +6,9 @@
|
|||
|
||||
[cut]
|
||||
|
||||
## Метрики: образец документа
|
||||
## Образец документа
|
||||
|
||||
Мы будем использовать для примера вот такой элемент, у которого есть рамка (border), поля (padding), отступы (margin) и прокрутка:
|
||||
Мы будем использовать для примера вот такой элемент, у которого есть рамка (border), поля (padding), и прокрутка:
|
||||
|
||||
```html
|
||||
<div id="example">
|
||||
|
|
@ -17,23 +17,45 @@
|
|||
<style>
|
||||
#example {
|
||||
width: 300px;
|
||||
|
||||
height: 200px;
|
||||
|
||||
border: 25px solid #F0E68C; /* рамка 25px */
|
||||
border: 25px solid #E8C48F; /* рамка 25px */
|
||||
|
||||
padding: 20px; /* поля 20px */
|
||||
margin: 20px; /* отступы 20px */
|
||||
|
||||
overflow: auto; /* прокрутка */
|
||||
}
|
||||
</style>
|
||||
```
|
||||
|
||||
У него нет отступов `margin`, в этой главе они не важны, так как метрики касаются именно размеров самого элемента, отступы в них не учитываются.
|
||||
|
||||
Результат выглядит так:
|
||||
|
||||
<img src="css.png">
|
||||
<img src="metric-css.png">
|
||||
|
||||
Вы можете открыть этот документ [edit src="metric"]в песочнице[/edit].
|
||||
Вы можете открыть [edit src="metric"]этот документ в песочнице[/edit].
|
||||
|
||||
[smart header="Внимание, полоса прокрутки!"]
|
||||
В иллюстрации выше намеренно продемонстрирован самый сложный и полный случай, когда у элемента есть ещё и полоса прокрутки.
|
||||
|
||||
В этом случае полоса прокрутки "отодвигает" содержимое вместе с `padding` влево, отбирая у него место.
|
||||
|
||||
Именно поэтому ширина содержимого обозначена как `content width` и равна `284px`, а не `300px`, как в CSS.
|
||||
|
||||
Точное значение получено в предположении, что ширина полосы прокрутки равна `16px`, то есть после её вычитания на содержимое остаётся `300 - 16 = 284px`. Конечно, она сильно зависит от браузера, устройства, ОС.
|
||||
|
||||
Мы должны в точности понимать, что происходит с размерами элемента при наличии полосы прокрутки, поэтому на картинке выше это отражено.
|
||||
[/smart]
|
||||
|
||||
[smart header="Поле `padding` заполнено текстом"]
|
||||
Обычно поля `padding` изображают пустыми, но так как текста много, то он заполняет нижнее поле `padding-bottom` в примере выше.
|
||||
|
||||
Во избежание путаницы заметим, что `padding` там, всё же, есть. Поля `padding` по CSS в элементе выше одинаковы со всех сторон. А такое заполнение -- нормальное поведение браузера.
|
||||
[/smart]
|
||||
|
||||
## Метрики
|
||||
|
||||
У элементов существует ряд свойств, содержащих их внешние и внутренние размеры. Мы будем называть их "метриками".
|
||||
|
||||
|
|
@ -41,55 +63,57 @@
|
|||
|
||||
Вот общая картина:
|
||||
|
||||
|
||||
<img src="summary2.png">
|
||||
|
||||
На картинке все они с трудом помещаются, но, как мы увидим далее, их значения просты и понятны.
|
||||
|
||||
Будем исследовать их снаружи элемента и вовнутрь.
|
||||
|
||||
## offsetWidth/Height
|
||||
|
||||
Эти свойства дают "внешнюю" ширину/высоту элемента, то есть его полный размер, включая рамки `border`, но исключая внешние отступы `margin`.
|
||||
|
||||
В примере выше:
|
||||
<ul>
|
||||
<li>`offsetWidth = 390` -- внешняя ширина блока</li>
|
||||
<li>`offsetHeight = 290` -- внешняя высота блока</li>
|
||||
</ul>
|
||||
|
||||
<img src="offsetWidth.png">
|
||||
|
||||
## offsetParent, offsetLeft/Top
|
||||
|
||||
[warn header="Используются редко..."]
|
||||
Ситуации, когда эти свойства нужны, можно перечислить по пальцам. Они возникают действительно редко. Как правило, эти свойства используют по ошибке, потому что не знают средств правильной работы с координатами, о которых мы поговорим позже.
|
||||
[/warn]
|
||||
Ситуации, когда эти свойства нужны, можно перечислить по пальцам. Они возникают действительно редко. Как правило, эти свойства используют, потому что не знают средств правильной работы с координатами, о которых мы поговорим позже.
|
||||
|
||||
В `offsetParent` -- ссылка родительский элемент в смысле отображения на странице.
|
||||
Несмотря на то, что эти свойства нужны реже всего, они -- самые "внешние", поэтому начнём с них.
|
||||
|
||||
**В `offsetParent` находится ссылка родительский элемент в смысле отображения на странице.**
|
||||
|
||||
Уточним, что имеется в виду.
|
||||
|
||||
Когда браузер рисует страницу, то он высчитывает дерево расположения элементов, иначе говоря "дерево геометрии" или "дерево рендеринга".
|
||||
Когда браузер рисует страницу, то он высчитывает дерево расположения элементов, иначе говоря "дерево геометрии" или "дерево рендеринга", которое содержит всю информацию о размерах.
|
||||
|
||||
Обычно элементы вложены друг в друга и структура дерева рендеринга повторяет DOM.
|
||||
При этом одни элементы естественным образом рисуются внутри других. Но, к примеру, если у элемента стоит `position:absolute`, то его расположение вычисляется уже не относительно непосредственного родителя `parentNode`, а относительно ближайшего <a href="http://www.w3.org/TR/CSS21/visuren.html#position-props">позиционированного элемента</a> (т.е. свойство `position` которого не равно `static`), или `BODY`, если такой отсутствует.
|
||||
|
||||
Но, к примеру, если у элемента стоит `position: absolute`, то его расположение вычисляется уже не относительно непосредственного родителя `parentNode`, а относительно ближайшего <a href="http://www.w3.org/TR/CSS21/visuren.html#position-props">позиционированного элемента</a> (т.е. свойство `position` которого не равно `static`), или `BODY`, если таковой отсутствует.
|
||||
Получается, что элемент имеет в дополнение к обычному родителю в DOM -- ещё одного "родителя по позиционированию", то есть относительно которого он рисуется. Этот элемент и будет в свойстве `offsetParent`.
|
||||
|
||||
Получается, что элемент имеет в дополнение к родителю в DOM -- ещё одного "родителя" в плане позиционирования, то есть относительно которого он рисуется. Этот элемент и будет в свойстве `offsetParent`.
|
||||
**Свойства `offsetLeft/Top` задают смещение относительно `offsetParent`.**
|
||||
|
||||
Свойства `offsetLeft/Top` задают смещение относительно `offsetParent`.
|
||||
|
||||
В примере ниже внешний `<div>` является родителем внутреннего по позиционированию, и отступ от него будет в `offsetLeft/Top`:
|
||||
В примере ниже внутренний `<div>` имеет DOM-родителя `<form>`, но `offsetParent` у него `<main>`, и сдвиги относительно его верхнего-левого угла будут в `offsetLeft/Top`:
|
||||
|
||||
```html
|
||||
<div style="position: relative">
|
||||
<main style="position: relative">
|
||||
<form>
|
||||
<div style="position: absolute; left: 180px; top: 180px">...</div>
|
||||
<div id="example" style="position: absolute; left: 180px; top: 180px">...</div>
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
```
|
||||
|
||||
<img src="offsetLeft.png">
|
||||
<img src="metric-offset-parent.png">
|
||||
|
||||
## offsetWidth/Height
|
||||
|
||||
Теперь переходим к самому элементу.
|
||||
|
||||
Эти два свойства -- самые простые. Они содержат "внешнюю" ширину/высоту элемента, то есть его полный размер, включая рамки `border`.
|
||||
|
||||
<img src="metric-offset-width-height.png">
|
||||
|
||||
Для нашего элемента:
|
||||
<ul>
|
||||
<li>`offsetWidth = 390` -- внешняя ширина блока, её можно получить сложением CSS-ширины (`300px`, но её часть на рисунке выше отнимает прокрутка, поэтому `284 + 16`), полей(`2*20px`) и рамок (`2*25px`).</li>
|
||||
<li>`offsetHeight = 290` -- внешняя высота блока.</li>
|
||||
</ul>
|
||||
|
||||
|
||||
[smart header="Метрики для невидимых элементов равны нулю."]
|
||||
|
|
@ -98,7 +122,7 @@
|
|||
|
||||
Для элементов с `display:none` или находящихся вне документа дерево рендеринга не строится. Для них метрики равны нулю. Кстати, и `offsetParent` для таких элементов тоже `null`.
|
||||
|
||||
Это дает нам **замечательный способ для проверки, виден ли элемент**:
|
||||
**Это дает нам замечательный способ для проверки, виден ли элемент**:
|
||||
|
||||
```js
|
||||
function isHidden(elem)
|
||||
|
|
@ -116,11 +140,11 @@ function isHidden(elem)
|
|||
|
||||
|
||||
|
||||
### clientTop/Left
|
||||
## clientTop/Left
|
||||
|
||||
Отступ внутренней части элемента от внешней.
|
||||
Далее внутри элемента у нас рамки `border`.
|
||||
|
||||
Другими словами, это ширина верхней/левой рамки(border) в пикселях.
|
||||
Для них есть свойства-метрики `clientTop` и `clientLeft`.
|
||||
|
||||
В нашем примере:
|
||||
<ul>
|
||||
|
|
@ -128,28 +152,38 @@ function isHidden(elem)
|
|||
<li>`clientTop = 25` -- ширина верхней рамки</li>
|
||||
</ul>
|
||||
|
||||
<img src="clientLeft.png">
|
||||
<img src="metric-client-left-top.png">
|
||||
|
||||
Казалось бы, зачем еще какие-то свойства, если ширину рамки можно получить напрямую из CSS? Да, можно. Обычно они действительно не нужны.
|
||||
...Но на самом деле они -- вовсе не рамки, а отступ внутренней части элемента от внешней.
|
||||
|
||||
В чём же разница?
|
||||
|
||||
Она возникает тогда, когда документ располагается *справа налево* (операционная система на арабском языке или иврите). Полоса прокрутки в этом случае находится слева, и тогда свойство `clientLeft` включает в себя еще и ширину полосы прокрутки.
|
||||
|
||||
Получится так:
|
||||
|
||||
<img src="metric-client-left-top-rtl.png">
|
||||
|
||||
Но в случае, когда документ располагается *справа налево* (арабский язык, иврит), полоса прокрутки находится слева, и тогда свойство `clientLeft` включает в себя еще и ширину полосы прокрутки.
|
||||
|
||||
## clientWidth/Height
|
||||
|
||||
Эти свойства -- размер внутренней зоны элемента внутри рамок `border`.
|
||||
Эти свойства -- размер элемента внутри рамок `border`.
|
||||
|
||||
Она включает в себя как ширину содержимого `width`, так и поля `padding`:
|
||||
Они включают в себя ширину содержимого `width` вместе с полями `padding`, но без прокрутки.
|
||||
|
||||
<img src="clientWidth.png">
|
||||
<img src="metric-client-width-height.png">
|
||||
|
||||
Как видно на рисунке выше, `clientWidth` в нашем документе складывается из ширины области содержимого (`284px`) плюс левый и правый `padding` (по `20px`), то есть всего `324px`.
|
||||
На рисунке выше посмотрим вначале на `clientHeight`, её посчитать проще всего. Прокрутки нет, так что это в точности то, что внутри рамок: CSS-ширина `200px` плюс верхнее и нижнее поля `padding` (по `20px`), итого `240px`.
|
||||
|
||||
Аналогично, `clientHeight` -- это высота области содержимого (`200px`) плюс верхний и нижний `padding` (по `20px`), то есть `240px`. На рисунке выше нижний `padding` заполнен текстом, но это неважно: по правилам он всегда входит в `clientHeight`.
|
||||
На рисунке нижний `padding` заполнен текстом, но это неважно: по правилам он всегда входит в `clientHeight`.
|
||||
|
||||
Теперь `clientWidth` -- ширина содержимого здесь не равна CSS-ширине, её часть "съедает" полоса прокрутки.
|
||||
Поэтому в `clientWidth` входит не CSS-ширина, а реальная ширина содержимого `284px` плюс левое и правое поля `padding` (по `20px`), итого `324px`.
|
||||
|
||||
|
||||
**Если `padding` нет, то `clientWidth/Height` в точности равны размеру области содержимого, внутри рамок и полосы прокрутки.**
|
||||
|
||||
<img src="clientWidthNoPadding.png">
|
||||
<img src="metric-client-width-nopadding.png">
|
||||
|
||||
Поэтому в тех случаях, когда мы точно знаем, что `padding` нет, их используют для определения внутренних размеров элемента.
|
||||
|
||||
|
|
@ -157,17 +191,17 @@ function isHidden(elem)
|
|||
|
||||
Эти свойства -- аналоги `clientWidth/clientHeight`, но с учетом прокрутки.
|
||||
|
||||
Свойства `clientWidth/clientHeight` относятся только к видимой области элемента, а `scrollWidth/scrollHeight` добавляют к ней прокрученную по горизонтали/вертикали.
|
||||
Свойства `clientWidth/clientHeight` относятся только к видимой области элемента, а `scrollWidth/scrollHeight` добавляют к ней прокрученную (которую не видно) по горизонтали/вертикали.
|
||||
|
||||
<img src="metric-scroll-width-height.png">
|
||||
|
||||
На рисунке выше:
|
||||
<ul>
|
||||
<li>`scrollHeight = 723` -- полная высота, включая прокрученную область</li>
|
||||
<li>`scrollWidth = 324` -- полная ширина, включая прокрученную область</li>
|
||||
<li>`scrollHeight = 723` -- полная внутренняя высота, включая прокрученную область.</li>
|
||||
<li>`scrollWidth = 324` -- полная внутренняя ширина, в данном случае прокрутки нет, поэтому она равна `clientWidth`.</li>
|
||||
</ul>
|
||||
|
||||
<img src="scrollWidth.png">
|
||||
|
||||
Эти свойства можно использовать, чтобы "распахнуть" элемент на всю ширину/высоту:
|
||||
Эти свойства можно использовать, чтобы "распахнуть" элемент на всю ширину/высоту, таким кодом:
|
||||
|
||||
```js
|
||||
element.style.height = element.scrollHeight + 'px';
|
||||
|
|
@ -183,14 +217,13 @@ element.style.height = element.scrollHeight + 'px';
|
|||
[/pre]
|
||||
[/online]
|
||||
|
||||
|
||||
## scrollLeft/scrollTop
|
||||
|
||||
Свойства `scrollLeft/scrollTop` -- ширина/высота невидимой, прокрученной в данный момент, части элемента слева и сверху.
|
||||
|
||||
Следующее иллюстрация показывает значения `scrollHeight` и `scrollTop` для блока с вертикальной прокруткой.
|
||||
|
||||
<img src="scrollTop.png">
|
||||
<img src="metric-scroll-top.png">
|
||||
|
||||
[smart header="`scrollLeft/scrollTop` можно изменять"]
|
||||
В отличие от большинства свойств, которые доступны только для чтения, значения `scrollLeft/scrollTop` можно изменить, и браузер выполнит прокрутку элемента.
|
||||
|
|
@ -205,7 +238,9 @@ element.style.height = element.scrollHeight + 'px';
|
|||
|
||||
## Не стоит брать width/height из CSS
|
||||
|
||||
Теперь несколько слов о том, как не надо делать.
|
||||
Мы рассмотрели метрики -- свойства, которые есть у DOM-элементов. Их обычно используют для получения их различных высот, ширин и прочих расстояний.
|
||||
|
||||
Теперь несколько слов о том, как *не* надо делать.
|
||||
|
||||
Как мы знаем, CSS-высоту и ширину можно установить с помощью `elem.style` и извлечь, используя `getComputedStyle`, которые в подробностях обсуждаются в главе [](/styles-and-classes).
|
||||
|
||||
|
|
@ -218,11 +253,11 @@ var elem = document.body;
|
|||
alert( getComputedStyle(elem).width ); // вывести CSS-ширину для elem
|
||||
```
|
||||
|
||||
Всегда ли такой подход сработает? Увы, нет!
|
||||
Не лучше ли получать ширину так, вместо метрик? Вовсе нет!
|
||||
|
||||
<ol>
|
||||
<li>Во-первых, CSS-свойства `width/height` зависят от другого свойства -- `box-sizing`, которое определяет, что такое, собственно, эти ширина и высота. Получается, что изменение этого свойства, к примеру, для более удобной вёрстки, может сломать JavaScript.</li>
|
||||
<li>Во-вторых, свойства `width/height` могут быть равны `auto`, например, для инлайн-элемента:
|
||||
<li>Во-первых, CSS-свойства `width/height` зависят от другого свойства -- `box-sizing`, которое определяет, что такое, собственно, эти ширина и высота. Получается, что изменение `box-sizing`, к примеру, для более удобной вёрстки, сломает такой JavaScript.</li>
|
||||
<li>Во-вторых, в CSS свойства `width/height` могут быть равны `auto`, например, для инлайн-элемента:
|
||||
|
||||
```html
|
||||
<!--+ run -->
|
||||
|
|
@ -234,48 +269,45 @@ alert( getComputedStyle(elem).width ); // вывести CSS-ширину для
|
|||
*/!*
|
||||
</script>
|
||||
```
|
||||
|
||||
Конечно, с точки зрения CSS размер `auto` -- совершенно нормально, но нам-то в JavaScript нужен конкретный размер в пикселях, который мы могли бы использовать для вычислений. Получается, что в данном случае ширина `width` из CSS вообще бесполезна.
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
|
||||
Конечно, с точки зрения CSS размер `auto` -- совершенно нормально, но нам-то в JavaScript нужен конкретный размер в пикселях, который мы могли бы использовать для вычислений. Получается, что в данном случае ширина `width` из CSS вообще бесполезна.
|
||||
|
||||
## Полоса прокрутки и содержимое
|
||||
Есть и ещё одна причина.
|
||||
|
||||
Полоса прокрутки -- причина многих проблем и недопониманий. Как говорится, "дьявол кроется в деталях". Недопустимо, чтобы наш код работал на элементах без прокрутки и начинал "глючить" с ней.
|
||||
|
||||
При наличии вертикальной полосы прокрутки, она как правило забирает себе место из "области содержимого" элемента.
|
||||
Как мы говорили ранее, при наличии вертикальной полосы прокрутки, в зависимости от браузера, устройства и операционной системы, она может сдвинуть содержимое.
|
||||
|
||||
И это учитывают свойства `clientWidth/clientHeight`.
|
||||
Получается, что реальная ширина содержимого меньше CSS-ширины. И это учитывают свойства `clientWidth/clientHeight`.
|
||||
|
||||
...Но при этом некоторые браузеры отражают реальное уменьшение ширины в результате `getComputedStyle(elem).width`, а некоторые -- нет.
|
||||
|
||||
В примере ниже у элемента с текстом в стилях указано `width:300px`. А вот `getComputedStyle` возвращает значение от `280px` до `300px`, в зависимости от ОС и браузера.
|
||||
...Но при этом некоторые браузеры также учитывают это в результате `getComputedStyle(elem).width`, то есть возвращают реальную внутреннюю ширину, а некоторые -- именно CSS-свойство. Эти кросс-браузерные отличия -- ещё один повод не использовать такой подход, а использовать свойства-метрики.
|
||||
|
||||
[online]
|
||||
Если ваш браузер в принципе показывает полосу прокрутки (например, под Windows почти все браузеры так делают), то вы можете протестировать это сами, нажав на кнопку в ифрейме ниже:
|
||||
[/online]
|
||||
Если ваш браузер показывает полосу прокрутки (например, под Windows почти все браузеры так делают), то вы можете протестировать это сами, нажав на кнопку в ифрейме ниже.
|
||||
|
||||
[iframe src="cssWidthScroll" link border=1]
|
||||
|
||||
Описанные разночтения касаются только чтения свойства `getComputedStyle(...).width` из JavaScript, визуальное отображение корректно в обоих случаях -- ширина текста при наличии прокрутки в обоих случаях уменьшается.
|
||||
У элемента с текстом в стилях указано `width:300px`.
|
||||
|
||||
Этот пример важен, чтобы ещё лучше понять: CSS-свойство `width` не следует использовать в JavaScript. А стоит использовать метрики, которые мы разобрали в этом разделе.
|
||||
На момент написания этой главы при тестировании в Chrome под Windows `alert` выводил `283px`, а в Firefox -- `300px`. При этом оба браузера показывали прокрутку. Это из-за того, что Firefox возвращал именно CSS-ширину, а Chrome -- реальную ширину, за вычетом прокрутки.
|
||||
[/online]
|
||||
|
||||
Описанные разночтения касаются только чтения свойства `getComputedStyle(...).width` из JavaScript, визуальное отображение корректно в обоих случаях.
|
||||
|
||||
## Итого
|
||||
|
||||
У элементов есть следующие метрики:
|
||||
<ul>
|
||||
<li>`clientWidth/clientHeight` -- ширина/высота видимой области, включая поля, но не полосы прокрутки.</li>
|
||||
<li>`clientLeft/clientTop` -- ширина левой/верхней рамки или, точнее, сдвиг клиентской области, относительно верхнего левого угла блока.
|
||||
Используется, преимущественно, в IE<8 для вычисления сдвига `document.body`.
|
||||
</li>
|
||||
<li>`scrollWidth/scrollHeight` -- ширина/высота прокручиваемой области. Включает в себя `padding` и не включает полосы прокрутки.</li>
|
||||
<li>`scrollLeft/scrollTop` -- ширина/высота прокрученной части документа, считается от верхнего левого угла.</li>
|
||||
<li>`offsetWidth/offsetHeight` -- "внешняя" ширина/высота блока, не считая отступов.</li>
|
||||
<li>`offsetParent` -- "родитель по дереву рендеринга" -- ближайшая ячейка таблицы, body для статического позиционирования или ближайший позиционированный элемент для других типов позиционирования.</li>
|
||||
<li>`offsetLeft/offsetTop` -- позиция в пикселях левого верхнего угла блока, относительно его `offsetParent`.</li>
|
||||
<li>`offsetWidth/offsetHeight` -- "внешняя" ширина/высота блока, включая рамки.</li>
|
||||
<li>`clientLeft/clientTop` -- отступ области содержимого от левого-верхнего угла элемента. Если операционная система располагает вертикальную прокрутку справа, то равны ширинам левой/верхней рамки, если же слева (ОС на иврите, арабском), то `clientLeft` включает в себя прокрутку.
|
||||
</li>
|
||||
<li>`clientWidth/clientHeight` -- ширина/высота содержимого вместе с полями `padding`, но без полосы прокрутки.</li>
|
||||
<li>`scrollWidth/scrollHeight` -- ширина/высота содержимого, включая прокручиваемую область. Включает в себя `padding` и не включает полосы прокрутки.</li>
|
||||
<li>`scrollLeft/scrollTop` -- ширина/высота прокрученной части документа, считается от верхнего левого угла.</li>
|
||||
</ul>
|
||||
|
||||
Все свойства, доступны только для чтения, кроме `scrollLeft/scrollTop`. Изменение этих свойств заставляет браузер прокручивать элемент.
|
||||
|
|
|
|||
|
|
@ -13,17 +13,12 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
function getWidth() {
|
||||
var style = window.getComputedStyle ? getComputedStyle(elem, '') : elem.currentStyle;
|
||||
return style.width;
|
||||
}
|
||||
|
||||
// FF: 200, Ch/Sa: 184, Op: 200, IE9: 184, IE7,8:200
|
||||
</script>
|
||||
|
||||
У элемента стоит <code>style="width:300px"</code><br>
|
||||
|
||||
<button onclick="alert(getWidth())">alert(width из getComputedStyle/currentStyle)</button>
|
||||
<button onclick="alert( getComputedStyle(elem).width )">alert( getComputedStyle(elem).width )</button>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
BIN
2-ui/1-document/15-metrics/metric-client-left-top-rtl.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-left-top-rtl.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-left-top-rtl@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-left-top-rtl@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 170 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-left-top.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-left-top.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-left-top@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-left-top@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 179 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-width-height.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-width-height.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 83 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-width-height@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-width-height@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 182 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-width-nopadding.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-width-nopadding.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
BIN
2-ui/1-document/15-metrics/metric-client-width-nopadding@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-client-width-nopadding@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 153 KiB |
BIN
2-ui/1-document/15-metrics/metric-css.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-css.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
BIN
2-ui/1-document/15-metrics/metric-css@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-css@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 174 KiB |
BIN
2-ui/1-document/15-metrics/metric-offset-parent.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-offset-parent.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
BIN
2-ui/1-document/15-metrics/metric-offset-width-height.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-offset-width-height.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 84 KiB |
BIN
2-ui/1-document/15-metrics/metric-offset-width-height@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-offset-width-height@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
BIN
2-ui/1-document/15-metrics/metric-scroll-top.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-scroll-top.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 117 KiB |
BIN
2-ui/1-document/15-metrics/metric-scroll-top@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-scroll-top@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 258 KiB |
BIN
2-ui/1-document/15-metrics/metric-scroll-width-height.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-scroll-width-height.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 108 KiB |
BIN
2-ui/1-document/15-metrics/metric-scroll-width-height@2x.png
Normal file
BIN
2-ui/1-document/15-metrics/metric-scroll-width-height@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 259 KiB |
|
|
@ -13,9 +13,8 @@
|
|||
width: 300px;
|
||||
height: 200px;
|
||||
overflow: auto;
|
||||
border: 25px solid #F0E68C;
|
||||
border: 25px solid #E8C48F;
|
||||
padding: 20px;
|
||||
margin: 20px;
|
||||
}
|
||||
.key {
|
||||
cursor: pointer;
|
||||
|
|
@ -29,9 +28,7 @@
|
|||
|
||||
<div id="example">
|
||||
<h3>Introduction</h3>
|
||||
<p>This Ecma Standard is based on several originating technologies, the most well known being JavaScript (Netscape) and JScript (Microsoft). The language was invented by Brendan Eich at Netscape and first appeared in that company's Navigator 2.0 browser. It has appeared in all subsequent browsers from Netscape and in all browsers from Microsoft starting with Internet Explorer 3.0.</p>
|
||||
|
||||
<p>The development of this Standard started in November 1996. The first edition of this Ecma Standard was adopted by the Ecma General Assembly of June 1997.</p>
|
||||
<p>This Ecma Standard is based on several originating technologies, the most well known being JavaScript (Netscape) and JScript (Microsoft). The language was invented by Brendan Eich at Netscape and first appeared in that company's Navigator 2.0 browser. It has appeared in all subsequent browsers from Netscape and in all browsers from Microsoft starting with Internet Explorer 3.0. The development of this Standard started in November 1996. The first edition of this Ecma Standard was adopted by the Ecma General Assembly of June 1997.</p>
|
||||
|
||||
<p>That Ecma Standard was submitted to ISO/IEC JTC 1 for adoption under the fast-track procedure, and approved as international standard ISO/IEC 16262, in April 1998. The Ecma General Assembly of June 1998 approved the second edition of ECMA-262 to keep it fully aligned with ISO/IEC 16262. Changes between the first and the second edition are editorial in nature.</p>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,24 +1,27 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="550px" height="203px" viewBox="0 0 550 203" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<svg width="550px" height="203px" viewBox="0 0 550 203" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: bin/sketchtool 1.3 (252) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>document-client-width-height.svg</title>
|
||||
<desc>Created with bin/sketchtool.</desc>
|
||||
<defs></defs>
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="document-client-width-height">
|
||||
<g id="noun_69008_cc" transform="translate(236.000000, 8.000000)" fill="#E8C48E">
|
||||
<path d="M179.1875,145 L3.8125,145 C1.708,145 0,143.36875 0,141.375 L0,3.625 C0,1.63125 1.708,0 3.8125,0 L179.1875,0 C181.284375,0 183,1.63125 183,3.625 L183,141.375 C183,143.36875 181.284375,145 179.1875,145 L179.1875,145 Z M7.625,137.75 L175.375,137.75 L175.375,7.25 L7.625,7.25 L7.625,137.75 L7.625,137.75 Z" id="Shape"></path>
|
||||
<path d="M175.375,36.25 L7.625,36.25 C5.5205,36.25 3.8125,34.61875 3.8125,32.625 C3.8125,30.63125 5.5205,29 7.625,29 L175.375,29 C177.471875,29 179.1875,30.63125 179.1875,32.625 C179.1875,34.61875 177.471875,36.25 175.375,36.25 L175.375,36.25 Z" id="Shape"></path>
|
||||
<path d="M61.32025,126.57775 C60.0545,126.57775 58.811625,125.98325 58.08725,124.89575 L34.892,89.84925 C34.060875,88.57325 34.121875,86.97825 35.052125,85.7675 L58.247375,55.86125 C59.497875,54.23 61.876875,53.8965 63.57725,55.1145 C65.27,56.3035 65.636,58.57275 64.377875,60.18225 L42.7305,88.102 L64.538,121.05325 C65.658875,122.7425 65.125125,124.99 63.340875,126.04125 C62.72325,126.411 62.014125,126.57775 61.32025,126.57775 L61.32025,126.57775 Z" id="Shape"></path>
|
||||
<path d="M122,126.57775 C121.306125,126.57775 120.597,126.411 119.97175,126.0195 C118.1875,124.961 117.646125,122.72075 118.774625,121.0315 L140.582125,88.08025 L118.927125,60.15325 C117.676625,58.5365 118.035,56.2745 119.72775,55.0855 C121.4205,53.88925 123.807125,54.23725 125.057625,55.84675 L148.24525,85.753 C149.183125,86.9565 149.244125,88.57325 148.405375,89.83475 L125.210125,124.88125 C124.501,125.98325 123.26575,126.57775 122,126.57775 L122,126.57775 Z" id="Shape"></path>
|
||||
<path d="M76.25,119.93675 C75.617125,119.93675 74.98425,119.7845 74.3895,119.48 C72.551875,118.50125 71.896125,116.29725 72.9255,114.521 L103.10525,63.162 C104.134625,61.4075 106.445,60.77675 108.3055,61.79175 C110.1355,62.7705 110.79125,64.96725 109.761875,66.729 L79.582125,118.088 C78.880625,119.26975 77.584375,119.93675 76.25,119.93675 L76.25,119.93675 Z" id="Shape"></path>
|
||||
<path d="M22.875,18.125 C22.875,20.1278125 21.1689062,21.75 19.0625,21.75 C16.9560938,21.75 15.25,20.1278125 15.25,18.125 C15.25,16.1221875 16.9560938,14.5 19.0625,14.5 C21.1689062,14.5 22.875,16.1221875 22.875,18.125 L22.875,18.125 Z" id="Shape"></path>
|
||||
<path d="M38.125,18.125 C38.125,20.1278125 36.4189062,21.75 34.3125,21.75 C32.2060938,21.75 30.5,20.1278125 30.5,18.125 C30.5,16.1221875 32.2060938,14.5 34.3125,14.5 C36.4189062,14.5 38.125,16.1221875 38.125,18.125 L38.125,18.125 Z" id="Shape"></path>
|
||||
<path d="M53.375,18.125 C53.375,20.1278125 51.6689062,21.75 49.5625,21.75 C47.4560938,21.75 45.75,20.1278125 45.75,18.125 C45.75,16.1221875 47.4560938,14.5 49.5625,14.5 C51.6689062,14.5 53.375,16.1221875 53.375,18.125 L53.375,18.125 Z" id="Shape"></path>
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="document-client-width-height.svg" sketch:type="MSArtboardGroup">
|
||||
<g id="noun_69008_cc" sketch:type="MSLayerGroup" transform="translate(236.000000, 8.000000)" fill="#E8C48E">
|
||||
<path d="M179.1875,145 L3.8125,145 C1.708,145 0,143.36875 0,141.375 L0,3.625 C0,1.63125 1.708,0 3.8125,0 L179.1875,0 C181.284375,0 183,1.63125 183,3.625 L183,141.375 C183,143.36875 181.284375,145 179.1875,145 L179.1875,145 Z M7.625,137.75 L175.375,137.75 L175.375,7.25 L7.625,7.25 L7.625,137.75 L7.625,137.75 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M175.375,36.25 L7.625,36.25 C5.5205,36.25 3.8125,34.61875 3.8125,32.625 C3.8125,30.63125 5.5205,29 7.625,29 L175.375,29 C177.471875,29 179.1875,30.63125 179.1875,32.625 C179.1875,34.61875 177.471875,36.25 175.375,36.25 L175.375,36.25 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M61.32025,126.57775 C60.0545,126.57775 58.811625,125.98325 58.08725,124.89575 L34.892,89.84925 C34.060875,88.57325 34.121875,86.97825 35.052125,85.7675 L58.247375,55.86125 C59.497875,54.23 61.876875,53.8965 63.57725,55.1145 C65.27,56.3035 65.636,58.57275 64.377875,60.18225 L42.7305,88.102 L64.538,121.05325 C65.658875,122.7425 65.125125,124.99 63.340875,126.04125 C62.72325,126.411 62.014125,126.57775 61.32025,126.57775 L61.32025,126.57775 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M122,126.57775 C121.306125,126.57775 120.597,126.411 119.97175,126.0195 C118.1875,124.961 117.646125,122.72075 118.774625,121.0315 L140.582125,88.08025 L118.927125,60.15325 C117.676625,58.5365 118.035,56.2745 119.72775,55.0855 C121.4205,53.88925 123.807125,54.23725 125.057625,55.84675 L148.24525,85.753 C149.183125,86.9565 149.244125,88.57325 148.405375,89.83475 L125.210125,124.88125 C124.501,125.98325 123.26575,126.57775 122,126.57775 L122,126.57775 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M76.25,119.93675 C75.617125,119.93675 74.98425,119.7845 74.3895,119.48 C72.551875,118.50125 71.896125,116.29725 72.9255,114.521 L103.10525,63.162 C104.134625,61.4075 106.445,60.77675 108.3055,61.79175 C110.1355,62.7705 110.79125,64.96725 109.761875,66.729 L79.582125,118.088 C78.880625,119.26975 77.584375,119.93675 76.25,119.93675 L76.25,119.93675 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M22.875,18.125 C22.875,20.1278125 21.1689062,21.75 19.0625,21.75 C16.9560938,21.75 15.25,20.1278125 15.25,18.125 C15.25,16.1221875 16.9560938,14.5 19.0625,14.5 C21.1689062,14.5 22.875,16.1221875 22.875,18.125 L22.875,18.125 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M38.125,18.125 C38.125,20.1278125 36.4189062,21.75 34.3125,21.75 C32.2060938,21.75 30.5,20.1278125 30.5,18.125 C30.5,16.1221875 32.2060938,14.5 34.3125,14.5 C36.4189062,14.5 38.125,16.1221875 38.125,18.125 L38.125,18.125 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M53.375,18.125 C53.375,20.1278125 51.6689062,21.75 49.5625,21.75 C47.4560938,21.75 45.75,20.1278125 45.75,18.125 C45.75,16.1221875 47.4560938,14.5 49.5625,14.5 C51.6689062,14.5 53.375,16.1221875 53.375,18.125 L53.375,18.125 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
<path d="M274.078672,96.0852289 L254.783869,88.4952289 C254.041565,88.2042289 253.073012,88.0582289 252.099374,88.0582289 C251.128279,88.0582289 250.154641,88.2042289 249.41488,88.4952289 C247.932815,89.0792289 247.932815,90.0242289 249.41488,90.6072289 L263.343236,96.0852289 L218.459304,96.0852289 C218.451678,96.0852289 218.444051,96.0862289 218.433883,96.0862289 L185.561537,96.0862289 L199.489894,90.6082289 C200.971959,90.0242289 200.971959,89.0792289 199.489894,88.4962289 C198.005287,87.9132289 195.60297,87.9132289 194.120905,88.4962289 L171.030695,97.5792289 L174.826102,99.0732289 L194.120905,106.663229 C194.863209,106.954229 195.831762,107.101229 196.8054,107.101229 C197.776495,107.101229 198.750133,106.954229 199.489894,106.663229 C200.971959,106.079229 200.971959,105.134229 199.489894,104.551229 L185.561537,99.0732289 L230.44547,99.0732289 C230.453096,99.0732289 230.460723,99.0722289 230.470891,99.0722289 L263.343236,99.0722289 L249.41488,104.550229 C247.932815,105.134229 247.932815,106.079229 249.41488,106.662229 C250.899486,107.245229 253.301804,107.245229 254.783869,106.662229 L277.874079,97.5792289 L274.078672,96.0852289" id="Fill-25" fill="#EE6B47" transform="translate(224.452387, 97.579729) rotate(-91.000000) translate(-224.452387, -97.579729) "></path>
|
||||
<path d="M408.414472,164.793761 L375.121164,157.203761 C373.840315,156.912761 372.16907,156.766761 370.489052,156.766761 C368.81342,156.766761 367.133402,156.912761 365.856939,157.203761 C363.299627,157.787761 363.299627,158.732761 365.856939,159.315761 L389.890409,164.793761 L312.442893,164.793761 C312.429734,164.793761 312.416574,164.794761 312.399028,164.794761 L255.677584,164.794761 L279.711053,159.316761 C282.268365,158.732761 282.268365,157.787761 279.711053,157.204761 C277.149355,156.621761 273.00414,156.621761 270.446828,157.204761 L230.604521,166.287761 L237.15352,167.781761 L270.446828,175.371761 C271.727678,175.662761 273.398923,175.809761 275.078941,175.809761 C276.754572,175.809761 278.43459,175.662761 279.711053,175.371761 C282.268365,174.787761 282.268365,173.842761 279.711053,173.259761 L255.677584,167.781761 L333.125099,167.781761 C333.138259,167.781761 333.151418,167.780761 333.168964,167.780761 L389.890409,167.780761 L365.856939,173.258761 C363.299627,173.842761 363.299627,174.787761 365.856939,175.370761 C368.418638,175.953761 372.563852,175.953761 375.121164,175.370761 L414.963472,166.287761 L408.414472,164.793761" id="Fill-26" fill="#EE6B47" transform="translate(322.783996, 166.288261) rotate(-179.000000) translate(-322.783996, -166.288261) "></path>
|
||||
<text id="documentElement.clie" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<path d="M274.078672,96.0852289 L254.783869,88.4952289 C254.041565,88.2042289 253.073012,88.0582289 252.099374,88.0582289 C251.128279,88.0582289 250.154641,88.2042289 249.41488,88.4952289 C247.932815,89.0792289 247.932815,90.0242289 249.41488,90.6072289 L263.343236,96.0852289 L218.459304,96.0852289 C218.451678,96.0852289 218.444051,96.0862289 218.433883,96.0862289 L185.561537,96.0862289 L199.489894,90.6082289 C200.971959,90.0242289 200.971959,89.0792289 199.489894,88.4962289 C198.005287,87.9132289 195.60297,87.9132289 194.120905,88.4962289 L171.030695,97.5792289 L174.826102,99.0732289 L194.120905,106.663229 C194.863209,106.954229 195.831762,107.101229 196.8054,107.101229 C197.776495,107.101229 198.750133,106.954229 199.489894,106.663229 C200.971959,106.079229 200.971959,105.134229 199.489894,104.551229 L185.561537,99.0732289 L230.44547,99.0732289 C230.453096,99.0732289 230.460723,99.0722289 230.470891,99.0722289 L263.343236,99.0722289 L249.41488,104.550229 C247.932815,105.134229 247.932815,106.079229 249.41488,106.662229 C250.899486,107.245229 253.301804,107.245229 254.783869,106.662229 L277.874079,97.5792289 L274.078672,96.0852289" id="Fill-25" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(224.452387, 97.579729) rotate(-91.000000) translate(-224.452387, -97.579729) "></path>
|
||||
<path d="M408.414472,164.793761 L375.121164,157.203761 C373.840315,156.912761 372.16907,156.766761 370.489052,156.766761 C368.81342,156.766761 367.133402,156.912761 365.856939,157.203761 C363.299627,157.787761 363.299627,158.732761 365.856939,159.315761 L389.890409,164.793761 L312.442893,164.793761 C312.429734,164.793761 312.416574,164.794761 312.399028,164.794761 L255.677584,164.794761 L279.711053,159.316761 C282.268365,158.732761 282.268365,157.787761 279.711053,157.204761 C277.149355,156.621761 273.00414,156.621761 270.446828,157.204761 L230.604521,166.287761 L237.15352,167.781761 L270.446828,175.371761 C271.727678,175.662761 273.398923,175.809761 275.078941,175.809761 C276.754572,175.809761 278.43459,175.662761 279.711053,175.371761 C282.268365,174.787761 282.268365,173.842761 279.711053,173.259761 L255.677584,167.781761 L333.125099,167.781761 C333.138259,167.781761 333.151418,167.780761 333.168964,167.780761 L389.890409,167.780761 L365.856939,173.258761 C363.299627,173.842761 363.299627,174.787761 365.856939,175.370761 C368.418638,175.953761 372.563852,175.953761 375.121164,175.370761 L414.963472,166.287761 L408.414472,164.793761" id="Fill-26" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(322.783996, 166.288261) rotate(-179.000000) translate(-322.783996, -166.288261) "></path>
|
||||
<text id="documentElement.clie" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="4" y="99">documentElement.clientHeight</tspan>
|
||||
</text>
|
||||
<text id="document.documentEle" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="document.documentEle" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="253" y="198">document.documentElement.clientWidth</tspan>
|
||||
</text>
|
||||
</g>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 6.2 KiB After Width: | Height: | Size: 6.8 KiB |
|
|
@ -1,33 +1,36 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="370px" height="280px" viewBox="0 0 370 280" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<svg width="370px" height="280px" viewBox="0 0 370 280" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: bin/sketchtool 1.3 (252) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>coords.svg</title>
|
||||
<desc>Created with bin/sketchtool.</desc>
|
||||
<defs></defs>
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="coords">
|
||||
<g id="noun_69008_cc" transform="translate(13.000000, 11.000000)" fill="#E8C48E">
|
||||
<path d="M339.770833,256 L7.22916667,256 C3.23866667,256 0,253.12 0,249.6 L0,6.4 C0,2.88 3.23866667,0 7.22916667,0 L339.770833,0 C343.746875,0 347,2.88 347,6.4 L347,249.6 C347,253.12 343.746875,256 339.770833,256 L339.770833,256 Z M14.4583333,243.2 L332.541667,243.2 L332.541667,12.8 L14.4583333,12.8 L14.4583333,243.2 L14.4583333,243.2 Z" id="Shape"></path>
|
||||
<path d="M332.541667,64 L14.4583333,64 C10.4678333,64 7.22916667,61.12 7.22916667,57.6 C7.22916667,54.08 10.4678333,51.2 14.4583333,51.2 L332.541667,51.2 C336.517708,51.2 339.770833,54.08 339.770833,57.6 C339.770833,61.12 336.517708,64 332.541667,64 L332.541667,64 Z" id="Shape"></path>
|
||||
<path d="M43.375,32 C43.375,35.536 40.1399479,38.4 36.1458333,38.4 C32.1517188,38.4 28.9166667,35.536 28.9166667,32 C28.9166667,28.464 32.1517188,25.6 36.1458333,25.6 C40.1399479,25.6 43.375,28.464 43.375,32 L43.375,32 Z" id="Shape"></path>
|
||||
<path d="M72.2916667,32 C72.2916667,35.536 69.0566146,38.4 65.0625,38.4 C61.0683854,38.4 57.8333333,35.536 57.8333333,32 C57.8333333,28.464 61.0683854,25.6 65.0625,25.6 C69.0566146,25.6 72.2916667,28.464 72.2916667,32 L72.2916667,32 Z" id="Shape"></path>
|
||||
<path d="M101.208333,32 C101.208333,35.536 97.9732812,38.4 93.9791667,38.4 C89.9850521,38.4 86.75,35.536 86.75,32 C86.75,28.464 89.9850521,25.6 93.9791667,25.6 C97.9732812,25.6 101.208333,28.464 101.208333,32 L101.208333,32 Z" id="Shape"></path>
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="coords.svg" sketch:type="MSArtboardGroup">
|
||||
<g id="noun_69008_cc" sketch:type="MSLayerGroup" transform="translate(13.000000, 11.000000)" fill="#E8C48E">
|
||||
<path d="M339.770833,256 L7.22916667,256 C3.23866667,256 0,253.12 0,249.6 L0,6.4 C0,2.88 3.23866667,0 7.22916667,0 L339.770833,0 C343.746875,0 347,2.88 347,6.4 L347,249.6 C347,253.12 343.746875,256 339.770833,256 L339.770833,256 Z M14.4583333,243.2 L332.541667,243.2 L332.541667,12.8 L14.4583333,12.8 L14.4583333,243.2 L14.4583333,243.2 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M332.541667,64 L14.4583333,64 C10.4678333,64 7.22916667,61.12 7.22916667,57.6 C7.22916667,54.08 10.4678333,51.2 14.4583333,51.2 L332.541667,51.2 C336.517708,51.2 339.770833,54.08 339.770833,57.6 C339.770833,61.12 336.517708,64 332.541667,64 L332.541667,64 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M43.375,32 C43.375,35.536 40.1399479,38.4 36.1458333,38.4 C32.1517188,38.4 28.9166667,35.536 28.9166667,32 C28.9166667,28.464 32.1517188,25.6 36.1458333,25.6 C40.1399479,25.6 43.375,28.464 43.375,32 L43.375,32 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M72.2916667,32 C72.2916667,35.536 69.0566146,38.4 65.0625,38.4 C61.0683854,38.4 57.8333333,35.536 57.8333333,32 C57.8333333,28.464 61.0683854,25.6 65.0625,25.6 C69.0566146,25.6 72.2916667,28.464 72.2916667,32 L72.2916667,32 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M101.208333,32 C101.208333,35.536 97.9732812,38.4 93.9791667,38.4 C89.9850521,38.4 86.75,35.536 86.75,32 C86.75,28.464 89.9850521,25.6 93.9791667,25.6 C97.9732812,25.6 101.208333,28.464 101.208333,32 L101.208333,32 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
<path d="M183.778498,109.408418 L171.15957,101.818418 C170.674099,101.527418 170.040659,101.381418 169.403893,101.381418 C168.76879,101.381418 168.132025,101.527418 167.648216,101.818418 C166.678936,102.402418 166.678936,103.347418 167.648216,103.930418 L176.757453,109.408418 L147.403067,109.408418 C147.398079,109.408418 147.393092,109.409418 147.386441,109.409418 L125.887712,109.409418 L134.996949,103.931418 C135.966229,103.347418 135.966229,102.402418 134.996949,101.819418 C134.026006,101.236418 132.454875,101.236418 131.485595,101.819418 L116.384446,110.902418 L118.866667,112.396418 L131.485595,119.986418 C131.971066,120.277418 132.604506,120.424418 133.241272,120.424418 C133.876375,120.424418 134.51314,120.277418 134.996949,119.986418 C135.966229,119.402418 135.966229,118.457418 134.996949,117.874418 L125.887712,112.396418 L155.242098,112.396418 C155.247086,112.396418 155.252073,112.395418 155.258724,112.395418 L176.757453,112.395418 L167.648216,117.873418 C166.678936,118.457418 166.678936,119.402418 167.648216,119.985418 C168.619159,120.568418 170.19029,120.568418 171.15957,119.985418 L186.260719,110.902418 L183.778498,109.408418" id="Fill-25" fill="#EE6B47" transform="translate(151.322583, 110.902918) rotate(-91.000000) translate(-151.322583, -110.902918) "></path>
|
||||
<path d="M217.647832,123.004454 L200.11755,115.414454 C199.443131,115.123454 198.563153,114.977454 197.678555,114.977454 C196.796267,114.977454 195.911669,115.123454 195.239559,115.414454 C193.89303,115.998454 193.89303,116.943454 195.239559,117.526454 L207.894159,123.004454 L167.114891,123.004454 C167.107962,123.004454 167.101033,123.005454 167.091794,123.005454 L137.225646,123.005454 L149.880245,117.527454 C151.226774,116.943454 151.226774,115.998454 149.880245,115.415454 C148.531407,114.832454 146.348783,114.832454 145.002254,115.415454 L124.023658,124.498454 L127.471973,125.992454 L145.002254,133.582454 C145.676673,133.873454 146.556652,134.020454 147.44125,134.020454 C148.323538,134.020454 149.208136,133.873454 149.880245,133.582454 C151.226774,132.998454 151.226774,132.053454 149.880245,131.470454 L137.225646,125.992454 L178.004914,125.992454 C178.011843,125.992454 178.018772,125.991454 178.02801,125.991454 L207.894159,125.991454 L195.239559,131.469454 C193.89303,132.053454 193.89303,132.998454 195.239559,133.581454 C196.588398,134.164454 198.771022,134.164454 200.11755,133.581454 L221.096146,124.498454 L217.647832,123.004454" id="Fill-27" fill="#EE6B47" transform="translate(172.559902, 124.498954) rotate(-91.000000) translate(-172.559902, -124.498954) "></path>
|
||||
<path d="M147.699419,172.81504 L125.29081,165.22504 C124.428713,164.93404 123.303854,164.78804 122.173091,164.78804 C121.045279,164.78804 119.914515,164.93404 119.055371,165.22504 C117.33413,165.80904 117.33413,166.75404 119.055371,167.33704 L135.231494,172.81504 L83.1041674,172.81504 C83.0953102,172.81504 83.0864531,172.81604 83.0746435,172.81604 L44.8973409,172.81604 L61.0734635,167.33804 C62.7947045,166.75404 62.7947045,165.80904 61.0734635,165.22604 C59.3492701,164.64304 56.5592654,164.64304 54.8380244,165.22604 L28.0215029,174.30904 L32.4294151,175.80304 L54.8380244,183.39304 C55.7001211,183.68404 56.8249801,183.83104 57.9557439,183.83104 C59.0835554,183.83104 60.2143192,183.68404 61.0734635,183.39304 C62.7947045,182.80904 62.7947045,181.86404 61.0734635,181.28104 L44.8973409,175.80304 L97.0246671,175.80304 C97.0335242,175.80304 97.0423814,175.80204 97.0541909,175.80204 L135.231494,175.80204 L119.055371,181.28004 C117.33413,181.86404 117.33413,182.80904 119.055371,183.39204 C120.779564,183.97504 123.569569,183.97504 125.29081,183.39204 L152.107332,174.30904 L147.699419,172.81504" id="Fill-26" fill="#EE6B47" transform="translate(90.064417, 174.309540) rotate(-179.000000) translate(-90.064417, -174.309540) "></path>
|
||||
<path d="M222.034748,195.487649 L185.706421,187.897649 C184.308809,187.606649 182.485213,187.460649 180.652045,187.460649 C178.823663,187.460649 176.990494,187.606649 175.597669,187.897649 C172.807232,188.481649 172.807232,189.426649 175.597669,190.009649 L201.822031,195.487649 L117.314396,195.487649 C117.300037,195.487649 117.285678,195.488649 117.266532,195.488649 L55.3743578,195.488649 L81.5987197,190.010649 C84.3891564,189.426649 84.3891564,188.481649 81.5987197,187.898649 C78.8034966,187.315649 74.2804044,187.315649 71.4899677,187.898649 L28.0156331,196.981649 L35.1616401,198.475649 L71.4899677,206.065649 C72.8875792,206.356649 74.7111751,206.503649 76.5443437,206.503649 C78.3727259,206.503649 80.2058945,206.356649 81.5987197,206.065649 C84.3891564,205.481649 84.3891564,204.536649 81.5987197,203.953649 L55.3743578,198.475649 L139.881993,198.475649 C139.896352,198.475649 139.910711,198.474649 139.929856,198.474649 L201.822031,198.474649 L175.597669,203.952649 C172.807232,204.536649 172.807232,205.481649 175.597669,206.064649 C178.392892,206.647649 182.915984,206.647649 185.706421,206.064649 L229.180755,196.981649 L222.034748,195.487649" id="Fill-28" fill="#EE6B47" transform="translate(128.598194, 196.982149) rotate(-179.000000) translate(-128.598194, -196.982149) "></path>
|
||||
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" x="151" y="145.957" width="75" height="29.043"></rect>
|
||||
<text id="<DIV>" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
|
||||
<path d="M183.778498,109.408418 L171.15957,101.818418 C170.674099,101.527418 170.040659,101.381418 169.403893,101.381418 C168.76879,101.381418 168.132025,101.527418 167.648216,101.818418 C166.678936,102.402418 166.678936,103.347418 167.648216,103.930418 L176.757453,109.408418 L147.403067,109.408418 C147.398079,109.408418 147.393092,109.409418 147.386441,109.409418 L125.887712,109.409418 L134.996949,103.931418 C135.966229,103.347418 135.966229,102.402418 134.996949,101.819418 C134.026006,101.236418 132.454875,101.236418 131.485595,101.819418 L116.384446,110.902418 L118.866667,112.396418 L131.485595,119.986418 C131.971066,120.277418 132.604506,120.424418 133.241272,120.424418 C133.876375,120.424418 134.51314,120.277418 134.996949,119.986418 C135.966229,119.402418 135.966229,118.457418 134.996949,117.874418 L125.887712,112.396418 L155.242098,112.396418 C155.247086,112.396418 155.252073,112.395418 155.258724,112.395418 L176.757453,112.395418 L167.648216,117.873418 C166.678936,118.457418 166.678936,119.402418 167.648216,119.985418 C168.619159,120.568418 170.19029,120.568418 171.15957,119.985418 L186.260719,110.902418 L183.778498,109.408418" id="Fill-25" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(151.322583, 110.902918) rotate(-91.000000) translate(-151.322583, -110.902918) "></path>
|
||||
<path d="M217.647832,123.004454 L200.11755,115.414454 C199.443131,115.123454 198.563153,114.977454 197.678555,114.977454 C196.796267,114.977454 195.911669,115.123454 195.239559,115.414454 C193.89303,115.998454 193.89303,116.943454 195.239559,117.526454 L207.894159,123.004454 L167.114891,123.004454 C167.107962,123.004454 167.101033,123.005454 167.091794,123.005454 L137.225646,123.005454 L149.880245,117.527454 C151.226774,116.943454 151.226774,115.998454 149.880245,115.415454 C148.531407,114.832454 146.348783,114.832454 145.002254,115.415454 L124.023658,124.498454 L127.471973,125.992454 L145.002254,133.582454 C145.676673,133.873454 146.556652,134.020454 147.44125,134.020454 C148.323538,134.020454 149.208136,133.873454 149.880245,133.582454 C151.226774,132.998454 151.226774,132.053454 149.880245,131.470454 L137.225646,125.992454 L178.004914,125.992454 C178.011843,125.992454 178.018772,125.991454 178.02801,125.991454 L207.894159,125.991454 L195.239559,131.469454 C193.89303,132.053454 193.89303,132.998454 195.239559,133.581454 C196.588398,134.164454 198.771022,134.164454 200.11755,133.581454 L221.096146,124.498454 L217.647832,123.004454" id="Fill-27" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(172.559902, 124.498954) rotate(-91.000000) translate(-172.559902, -124.498954) "></path>
|
||||
<path d="M147.699419,172.81504 L125.29081,165.22504 C124.428713,164.93404 123.303854,164.78804 122.173091,164.78804 C121.045279,164.78804 119.914515,164.93404 119.055371,165.22504 C117.33413,165.80904 117.33413,166.75404 119.055371,167.33704 L135.231494,172.81504 L83.1041674,172.81504 C83.0953102,172.81504 83.0864531,172.81604 83.0746435,172.81604 L44.8973409,172.81604 L61.0734635,167.33804 C62.7947045,166.75404 62.7947045,165.80904 61.0734635,165.22604 C59.3492701,164.64304 56.5592654,164.64304 54.8380244,165.22604 L28.0215029,174.30904 L32.4294151,175.80304 L54.8380244,183.39304 C55.7001211,183.68404 56.8249801,183.83104 57.9557439,183.83104 C59.0835554,183.83104 60.2143192,183.68404 61.0734635,183.39304 C62.7947045,182.80904 62.7947045,181.86404 61.0734635,181.28104 L44.8973409,175.80304 L97.0246671,175.80304 C97.0335242,175.80304 97.0423814,175.80204 97.0541909,175.80204 L135.231494,175.80204 L119.055371,181.28004 C117.33413,181.86404 117.33413,182.80904 119.055371,183.39204 C120.779564,183.97504 123.569569,183.97504 125.29081,183.39204 L152.107332,174.30904 L147.699419,172.81504" id="Fill-26" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(90.064417, 174.309540) rotate(-179.000000) translate(-90.064417, -174.309540) "></path>
|
||||
<path d="M222.034748,195.487649 L185.706421,187.897649 C184.308809,187.606649 182.485213,187.460649 180.652045,187.460649 C178.823663,187.460649 176.990494,187.606649 175.597669,187.897649 C172.807232,188.481649 172.807232,189.426649 175.597669,190.009649 L201.822031,195.487649 L117.314396,195.487649 C117.300037,195.487649 117.285678,195.488649 117.266532,195.488649 L55.3743578,195.488649 L81.5987197,190.010649 C84.3891564,189.426649 84.3891564,188.481649 81.5987197,187.898649 C78.8034966,187.315649 74.2804044,187.315649 71.4899677,187.898649 L28.0156331,196.981649 L35.1616401,198.475649 L71.4899677,206.065649 C72.8875792,206.356649 74.7111751,206.503649 76.5443437,206.503649 C78.3727259,206.503649 80.2058945,206.356649 81.5987197,206.065649 C84.3891564,205.481649 84.3891564,204.536649 81.5987197,203.953649 L55.3743578,198.475649 L139.881993,198.475649 C139.896352,198.475649 139.910711,198.474649 139.929856,198.474649 L201.822031,198.474649 L175.597669,203.952649 C172.807232,204.536649 172.807232,205.481649 175.597669,206.064649 C178.392892,206.647649 182.915984,206.647649 185.706421,206.064649 L229.180755,196.981649 L222.034748,195.487649" id="Fill-28" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(128.598194, 196.982149) rotate(-179.000000) translate(-128.598194, -196.982149) "></path>
|
||||
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="151" y="145.957" width="75" height="29.043"></rect>
|
||||
<text id="<DIV>" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="169.051859" y="165.543917"><DIV></tspan>
|
||||
</text>
|
||||
<text id="top" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="top" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="119" y="112">top</tspan>
|
||||
</text>
|
||||
<text id="bottom" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="bottom" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="185" y="112">bottom</tspan>
|
||||
</text>
|
||||
<text id="left" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="left" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="73" y="162">left</tspan>
|
||||
</text>
|
||||
<text id="right" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="right" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="109" y="216">right</tspan>
|
||||
</text>
|
||||
</g>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 7.9 KiB After Width: | Height: | Size: 8.6 KiB |
|
|
@ -1,55 +1,58 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="440px" height="309px" viewBox="0 0 440 309" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<svg width="440px" height="309px" viewBox="0 0 440 309" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: bin/sketchtool 1.3 (252) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>dom-links-elements.svg</title>
|
||||
<desc>Created with bin/sketchtool.</desc>
|
||||
<defs></defs>
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="dom-links-elements">
|
||||
<text id="document.documentEle" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="dom-links-elements.svg" sketch:type="MSArtboardGroup">
|
||||
<text id="document.documentEle" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="137.692383" y="22">document.documentElement <HTML></tspan>
|
||||
</text>
|
||||
<text id="document.body-(если-" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="document.body-(если-" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="172.84375" y="90">document.body (если внутри body)</tspan>
|
||||
</text>
|
||||
<path d="M221.5,67.5 L221.5,37.5" id="Line-4" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M221.5,67.5 L221.5,37.5" id="Line-4" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-4-decoration-1" d="M221.5,37.5 C220.45,41.28 219.55,44.52 218.5,48.3 C220.6,48.3 222.4,48.3 224.5,48.3 C223.45,44.52 222.55,41.28 221.5,37.5 C221.5,37.5 221.5,37.5 221.5,37.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M233.2715,132.2195 C233.9275,132.2195 234.4565,132.7755 234.4565,133.4575 C234.4565,134.1385 233.9275,134.6935 233.2455,134.6935 C232.5895,134.6935 232.0595,134.1385 232.0595,133.4575 C232.0595,132.7755 232.5895,132.2195 233.2715,132.2195 L233.2715,132.2195 Z M231.1755,137.6715 C230.4935,137.6715 229.9645,137.1165 229.9645,136.4345 C229.9645,135.7535 230.4935,135.1985 231.1515,135.1985 C231.8325,135.1985 232.3625,135.7535 232.3625,136.4345 C232.3625,137.1165 231.8325,137.6715 231.1755,137.6715 L231.1755,137.6715 Z M231.1755,129.2415 C231.8325,129.2415 232.3625,129.7975 232.3625,130.4785 C232.3625,131.1605 231.8325,131.7155 231.1515,131.7155 C230.4935,131.7155 229.9645,131.1605 229.9645,130.4785 C229.9645,129.7975 230.4935,129.2415 231.1755,129.2415 L231.1755,129.2415 Z M229.6615,132.2955 C230.3185,132.2955 230.8475,132.8505 230.8475,133.5325 C230.8475,134.1885 230.3185,134.7435 229.6365,134.7435 C228.9805,134.7435 228.4495,134.1885 228.4495,133.5075 C228.4495,132.8505 228.9805,132.2955 229.6615,132.2955 L229.6615,132.2955 Z M229.0815,140.6495 C228.4245,140.6495 227.8695,140.0945 227.8695,139.4135 C227.8695,138.7315 228.4005,138.2015 229.0565,138.2015 C229.7375,138.2015 230.2675,138.7315 230.2675,139.4135 C230.2675,140.0945 229.7375,140.6495 229.0815,140.6495 L229.0815,140.6495 Z M229.0815,126.2635 C229.7375,126.2635 230.2675,126.8195 230.2675,127.5005 C230.2675,128.1815 229.7375,128.7375 229.0565,128.7375 C228.4005,128.7375 227.8695,128.1815 227.8695,127.5005 C227.8695,126.8195 228.4245,126.2635 229.0815,126.2635 L229.0815,126.2635 Z M226.9875,143.6275 C226.3305,143.6275 225.7755,143.0725 225.7755,142.3905 C225.7755,141.7105 226.3045,141.1795 226.9605,141.1795 C227.6425,141.1795 228.1725,141.7105 228.1725,142.3905 C228.1725,143.0725 227.6425,143.6275 226.9875,143.6275 L226.9875,143.6275 Z M226.9875,123.2855 C227.6425,123.2855 228.1725,123.8415 228.1725,124.5225 C228.1725,125.2035 227.6425,125.7595 226.9605,125.7595 C226.3045,125.7595 225.7755,125.2035 225.7755,124.5225 C225.7755,123.8415 226.3305,123.2855 226.9875,123.2855 L226.9875,123.2855 Z M226.0015,132.2955 C226.6575,132.2955 227.1885,132.8505 227.1885,133.5325 C227.1885,134.1885 226.6575,134.7435 225.9775,134.7435 C225.3215,134.7435 224.7905,134.1885 224.7905,133.5075 C224.7905,132.8505 225.3465,132.2955 226.0015,132.2955 L226.0015,132.2955 Z M222.3675,132.2955 C223.0245,132.2955 223.5545,132.8505 223.5545,133.5325 C223.5545,134.1885 222.9985,134.7435 222.3425,134.7435 C221.6865,134.7435 221.1305,134.1885 221.1305,133.5075 C221.1305,132.8505 221.6865,132.2955 222.3675,132.2955 L222.3675,132.2955 Z M218.7085,132.2955 C219.3645,132.2955 219.8945,132.8505 219.8945,133.5325 C219.8945,134.1885 219.3645,134.7435 218.6835,134.7435 C218.0275,134.7435 217.4965,134.1885 217.4965,133.5075 C217.4965,132.8505 218.0275,132.2955 218.7085,132.2955 L218.7085,132.2955 Z M215.0485,132.2955 C215.7045,132.2955 216.2355,132.8505 216.2355,133.5325 C216.2355,134.1885 215.7045,134.7435 215.0235,134.7435 C214.3665,134.7435 213.8365,134.1885 213.8365,133.5075 C213.8365,132.8505 214.3925,132.2955 215.0485,132.2955 L215.0485,132.2955 Z M211.4145,132.2955 C212.0705,132.2955 212.6005,132.8505 212.6005,133.5325 C212.6005,134.1885 212.0455,134.7435 211.3885,134.7435 C210.7335,134.7435 210.1775,134.1885 210.1775,133.5075 C210.1775,132.8505 210.7335,132.2955 211.4145,132.2955 L211.4145,132.2955 Z M207.7545,132.2955 C208.4105,132.2955 208.9415,132.8505 208.9415,133.5325 C208.9415,134.1885 208.4105,134.7435 207.7295,134.7435 C207.0735,134.7435 206.5435,134.1885 206.5435,133.5075 C206.5435,132.8505 207.0735,132.2955 207.7545,132.2955 L207.7545,132.2955 Z" id="Fill-7" fill="#EE6B47" transform="translate(220.500000, 133.456500) rotate(-90.000000) translate(-220.500000, -133.456500) "></path>
|
||||
<path d="M14.5,108 L427,108" id="Line-5" stroke="#8A704D" stroke-width="2" stroke-linecap="square"></path>
|
||||
<text id="parentElement" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<path d="M233.2715,132.2195 C233.9275,132.2195 234.4565,132.7755 234.4565,133.4575 C234.4565,134.1385 233.9275,134.6935 233.2455,134.6935 C232.5895,134.6935 232.0595,134.1385 232.0595,133.4575 C232.0595,132.7755 232.5895,132.2195 233.2715,132.2195 L233.2715,132.2195 Z M231.1755,137.6715 C230.4935,137.6715 229.9645,137.1165 229.9645,136.4345 C229.9645,135.7535 230.4935,135.1985 231.1515,135.1985 C231.8325,135.1985 232.3625,135.7535 232.3625,136.4345 C232.3625,137.1165 231.8325,137.6715 231.1755,137.6715 L231.1755,137.6715 Z M231.1755,129.2415 C231.8325,129.2415 232.3625,129.7975 232.3625,130.4785 C232.3625,131.1605 231.8325,131.7155 231.1515,131.7155 C230.4935,131.7155 229.9645,131.1605 229.9645,130.4785 C229.9645,129.7975 230.4935,129.2415 231.1755,129.2415 L231.1755,129.2415 Z M229.6615,132.2955 C230.3185,132.2955 230.8475,132.8505 230.8475,133.5325 C230.8475,134.1885 230.3185,134.7435 229.6365,134.7435 C228.9805,134.7435 228.4495,134.1885 228.4495,133.5075 C228.4495,132.8505 228.9805,132.2955 229.6615,132.2955 L229.6615,132.2955 Z M229.0815,140.6495 C228.4245,140.6495 227.8695,140.0945 227.8695,139.4135 C227.8695,138.7315 228.4005,138.2015 229.0565,138.2015 C229.7375,138.2015 230.2675,138.7315 230.2675,139.4135 C230.2675,140.0945 229.7375,140.6495 229.0815,140.6495 L229.0815,140.6495 Z M229.0815,126.2635 C229.7375,126.2635 230.2675,126.8195 230.2675,127.5005 C230.2675,128.1815 229.7375,128.7375 229.0565,128.7375 C228.4005,128.7375 227.8695,128.1815 227.8695,127.5005 C227.8695,126.8195 228.4245,126.2635 229.0815,126.2635 L229.0815,126.2635 Z M226.9875,143.6275 C226.3305,143.6275 225.7755,143.0725 225.7755,142.3905 C225.7755,141.7105 226.3045,141.1795 226.9605,141.1795 C227.6425,141.1795 228.1725,141.7105 228.1725,142.3905 C228.1725,143.0725 227.6425,143.6275 226.9875,143.6275 L226.9875,143.6275 Z M226.9875,123.2855 C227.6425,123.2855 228.1725,123.8415 228.1725,124.5225 C228.1725,125.2035 227.6425,125.7595 226.9605,125.7595 C226.3045,125.7595 225.7755,125.2035 225.7755,124.5225 C225.7755,123.8415 226.3305,123.2855 226.9875,123.2855 L226.9875,123.2855 Z M226.0015,132.2955 C226.6575,132.2955 227.1885,132.8505 227.1885,133.5325 C227.1885,134.1885 226.6575,134.7435 225.9775,134.7435 C225.3215,134.7435 224.7905,134.1885 224.7905,133.5075 C224.7905,132.8505 225.3465,132.2955 226.0015,132.2955 L226.0015,132.2955 Z M222.3675,132.2955 C223.0245,132.2955 223.5545,132.8505 223.5545,133.5325 C223.5545,134.1885 222.9985,134.7435 222.3425,134.7435 C221.6865,134.7435 221.1305,134.1885 221.1305,133.5075 C221.1305,132.8505 221.6865,132.2955 222.3675,132.2955 L222.3675,132.2955 Z M218.7085,132.2955 C219.3645,132.2955 219.8945,132.8505 219.8945,133.5325 C219.8945,134.1885 219.3645,134.7435 218.6835,134.7435 C218.0275,134.7435 217.4965,134.1885 217.4965,133.5075 C217.4965,132.8505 218.0275,132.2955 218.7085,132.2955 L218.7085,132.2955 Z M215.0485,132.2955 C215.7045,132.2955 216.2355,132.8505 216.2355,133.5325 C216.2355,134.1885 215.7045,134.7435 215.0235,134.7435 C214.3665,134.7435 213.8365,134.1885 213.8365,133.5075 C213.8365,132.8505 214.3925,132.2955 215.0485,132.2955 L215.0485,132.2955 Z M211.4145,132.2955 C212.0705,132.2955 212.6005,132.8505 212.6005,133.5325 C212.6005,134.1885 212.0455,134.7435 211.3885,134.7435 C210.7335,134.7435 210.1775,134.1885 210.1775,133.5075 C210.1775,132.8505 210.7335,132.2955 211.4145,132.2955 L211.4145,132.2955 Z M207.7545,132.2955 C208.4105,132.2955 208.9415,132.8505 208.9415,133.5325 C208.9415,134.1885 208.4105,134.7435 207.7295,134.7435 C207.0735,134.7435 206.5435,134.1885 206.5435,133.5075 C206.5435,132.8505 207.0735,132.2955 207.7545,132.2955 L207.7545,132.2955 Z" id="Fill-7" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(220.500000, 133.456500) rotate(-90.000000) translate(-220.500000, -133.456500) "></path>
|
||||
<path d="M14.5,108 L427,108" id="Line-5" stroke="#8A704D" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
|
||||
<text id="parentElement" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<tspan x="175" y="165" fill="#8A704D">parent</tspan>
|
||||
<tspan x="221.183594" y="165" fill="#EE6B47">Element</tspan>
|
||||
</text>
|
||||
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" x="183" y="208" width="75" height="24"></rect>
|
||||
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" x="165" y="73" width="113" height="24"></rect>
|
||||
<rect id="Rectangle-8" stroke="#E8C48E" stroke-width="2" x="131" y="5" width="194" height="24"></rect>
|
||||
<text id="<DIV>" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
|
||||
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="183" y="208" width="75" height="24"></rect>
|
||||
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="165" y="73" width="113" height="24"></rect>
|
||||
<rect id="Rectangle-8" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="131" y="5" width="194" height="24"></rect>
|
||||
<text id="<DIV>" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="201.051859" y="225"><DIV></tspan>
|
||||
</text>
|
||||
<path d="M220.5,200.5 L220.5,174.5" id="Line-6" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M220.5,200.5 L220.5,174.5" id="Line-6" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-6-decoration-1" d="M220.5,174.5 C219.45,178.28 218.55,181.52 217.5,185.3 C219.6,185.3 221.4,185.3 223.5,185.3 C222.45,181.52 221.55,178.28 220.5,174.5 C220.5,174.5 220.5,174.5 220.5,174.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M267.5,219.5 L427,219.5" id="Line-7" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M267.5,219.5 L427,219.5" id="Line-7" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-7-decoration-1" d="M426.5,219.5 C422.72,218.45 419.48,217.55 415.7,216.5 C415.7,218.6 415.7,220.4 415.7,222.5 C419.48,221.45 422.72,220.55 426.5,219.5 C426.5,219.5 426.5,219.5 426.5,219.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<text id="nextElementSibling" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<text id="nextElementSibling" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<tspan x="276" y="205" fill="#8A704D">next</tspan>
|
||||
<tspan x="306.789062" y="205" fill="#EE6B47">Element</tspan>
|
||||
<tspan x="360.669922" y="205" fill="#8A704D">Sibling</tspan>
|
||||
</text>
|
||||
<path d="M168,219.5 L12,219.5" id="Line-8" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M168,219.5 L12,219.5" id="Line-8" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-8-decoration-1" d="M12,219.5 C15.78,220.55 19.02,221.45 22.8,222.5 C22.8,220.4 22.8,218.6 22.8,216.5 C19.02,217.55 15.78,218.45 12,219.5 C12,219.5 12,219.5 12,219.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<text id="previousElementSibli" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<text id="previousElementSibli" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<tspan x="6" y="205" fill="#8A704D">previous</tspan>
|
||||
<tspan x="67.578125" y="205" fill="#EE6B47">Element</tspan>
|
||||
<tspan x="121.458984" y="205" fill="#8A704D">Sibling</tspan>
|
||||
</text>
|
||||
<path d="M116.5,278.5 L174.5,242.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square"></path>
|
||||
<path d="M325,279 L269.5,242.5" id="Line-3" stroke="#EE6B47" stroke-width="2" stroke-linecap="square"></path>
|
||||
<text id="children" font-family="Consolas" font-size="14" font-weight="bold" fill="#EE6B47">
|
||||
<path d="M116.5,278.5 L174.5,242.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M325,279 L269.5,242.5" id="Line-3" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
|
||||
<text id="children" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#EE6B47">
|
||||
<tspan x="188" y="266">children</tspan>
|
||||
</text>
|
||||
<text id="firstElementChild--" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<text id="firstElementChild--" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<tspan x="43" y="300" fill="#8A704D">first</tspan>
|
||||
<tspan x="81.4863281" y="300" fill="#EE6B47">Element</tspan>
|
||||
<tspan x="135.367188" y="300" fill="#8A704D">Child </tspan>
|
||||
</text>
|
||||
<text id="lastElementChild" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<text id="lastElementChild" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
|
||||
<tspan x="273" y="300" fill="#8A704D">last</tspan>
|
||||
<tspan x="303.789062" y="300" fill="#EE6B47">Element</tspan>
|
||||
<tspan x="357.669922" y="300" fill="#8A704D">Child</tspan>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 8.8 KiB After Width: | Height: | Size: 9.7 KiB |
|
|
@ -1,54 +1,57 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="420px" height="368px" viewBox="0 0 420 368" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<svg width="420px" height="368px" viewBox="0 0 420 368" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: bin/sketchtool 1.3 (252) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>dom-links.svg</title>
|
||||
<desc>Created with bin/sketchtool.</desc>
|
||||
<defs></defs>
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="dom-links">
|
||||
<text id="document" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="dom-links.svg" sketch:type="MSArtboardGroup">
|
||||
<text id="document" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="177.710938" y="18">document</tspan>
|
||||
</text>
|
||||
<text id="document.documentEle" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="document.documentEle" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="125.692383" y="85">document.documentElement <HTML></tspan>
|
||||
</text>
|
||||
<text id="document.body-(если-" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="document.body-(если-" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="160.84375" y="153">document.body (если внутри body)</tspan>
|
||||
</text>
|
||||
<path d="M209.5,130.5 L209.5,100.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M209.5,130.5 L209.5,100.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-decoration-1" d="M209.5,100.5 C208.45,104.28 207.55,107.52 206.5,111.3 C208.6,111.3 210.4,111.3 212.5,111.3 C211.45,107.52 210.55,104.28 209.5,100.5 C209.5,100.5 209.5,100.5 209.5,100.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M221.2715,195.2195 C221.9275,195.2195 222.4565,195.7755 222.4565,196.4575 C222.4565,197.1385 221.9275,197.6935 221.2455,197.6935 C220.5895,197.6935 220.0595,197.1385 220.0595,196.4575 C220.0595,195.7755 220.5895,195.2195 221.2715,195.2195 L221.2715,195.2195 Z M219.1755,200.6715 C218.4935,200.6715 217.9645,200.1165 217.9645,199.4345 C217.9645,198.7535 218.4935,198.1985 219.1515,198.1985 C219.8325,198.1985 220.3625,198.7535 220.3625,199.4345 C220.3625,200.1165 219.8325,200.6715 219.1755,200.6715 L219.1755,200.6715 Z M219.1755,192.2415 C219.8325,192.2415 220.3625,192.7975 220.3625,193.4785 C220.3625,194.1605 219.8325,194.7155 219.1515,194.7155 C218.4935,194.7155 217.9645,194.1605 217.9645,193.4785 C217.9645,192.7975 218.4935,192.2415 219.1755,192.2415 L219.1755,192.2415 Z M217.6615,195.2955 C218.3185,195.2955 218.8475,195.8505 218.8475,196.5325 C218.8475,197.1885 218.3185,197.7435 217.6365,197.7435 C216.9805,197.7435 216.4495,197.1885 216.4495,196.5075 C216.4495,195.8505 216.9805,195.2955 217.6615,195.2955 L217.6615,195.2955 Z M217.0815,203.6495 C216.4245,203.6495 215.8695,203.0945 215.8695,202.4135 C215.8695,201.7315 216.4005,201.2015 217.0565,201.2015 C217.7375,201.2015 218.2675,201.7315 218.2675,202.4135 C218.2675,203.0945 217.7375,203.6495 217.0815,203.6495 L217.0815,203.6495 Z M217.0815,189.2635 C217.7375,189.2635 218.2675,189.8195 218.2675,190.5005 C218.2675,191.1815 217.7375,191.7375 217.0565,191.7375 C216.4005,191.7375 215.8695,191.1815 215.8695,190.5005 C215.8695,189.8195 216.4245,189.2635 217.0815,189.2635 L217.0815,189.2635 Z M214.9875,206.6275 C214.3305,206.6275 213.7755,206.0725 213.7755,205.3905 C213.7755,204.7105 214.3045,204.1795 214.9605,204.1795 C215.6425,204.1795 216.1725,204.7105 216.1725,205.3905 C216.1725,206.0725 215.6425,206.6275 214.9875,206.6275 L214.9875,206.6275 Z M214.9875,186.2855 C215.6425,186.2855 216.1725,186.8415 216.1725,187.5225 C216.1725,188.2035 215.6425,188.7595 214.9605,188.7595 C214.3045,188.7595 213.7755,188.2035 213.7755,187.5225 C213.7755,186.8415 214.3305,186.2855 214.9875,186.2855 L214.9875,186.2855 Z M214.0015,195.2955 C214.6575,195.2955 215.1885,195.8505 215.1885,196.5325 C215.1885,197.1885 214.6575,197.7435 213.9775,197.7435 C213.3215,197.7435 212.7905,197.1885 212.7905,196.5075 C212.7905,195.8505 213.3465,195.2955 214.0015,195.2955 L214.0015,195.2955 Z M210.3675,195.2955 C211.0245,195.2955 211.5545,195.8505 211.5545,196.5325 C211.5545,197.1885 210.9985,197.7435 210.3425,197.7435 C209.6865,197.7435 209.1305,197.1885 209.1305,196.5075 C209.1305,195.8505 209.6865,195.2955 210.3675,195.2955 L210.3675,195.2955 Z M206.7085,195.2955 C207.3645,195.2955 207.8945,195.8505 207.8945,196.5325 C207.8945,197.1885 207.3645,197.7435 206.6835,197.7435 C206.0275,197.7435 205.4965,197.1885 205.4965,196.5075 C205.4965,195.8505 206.0275,195.2955 206.7085,195.2955 L206.7085,195.2955 Z M203.0485,195.2955 C203.7045,195.2955 204.2355,195.8505 204.2355,196.5325 C204.2355,197.1885 203.7045,197.7435 203.0235,197.7435 C202.3665,197.7435 201.8365,197.1885 201.8365,196.5075 C201.8365,195.8505 202.3925,195.2955 203.0485,195.2955 L203.0485,195.2955 Z M199.4145,195.2955 C200.0705,195.2955 200.6005,195.8505 200.6005,196.5325 C200.6005,197.1885 200.0455,197.7435 199.3885,197.7435 C198.7335,197.7435 198.1775,197.1885 198.1775,196.5075 C198.1775,195.8505 198.7335,195.2955 199.4145,195.2955 L199.4145,195.2955 Z M195.7545,195.2955 C196.4105,195.2955 196.9415,195.8505 196.9415,196.5325 C196.9415,197.1885 196.4105,197.7435 195.7295,197.7435 C195.0735,197.7435 194.5435,197.1885 194.5435,196.5075 C194.5435,195.8505 195.0735,195.2955 195.7545,195.2955 L195.7545,195.2955 Z" id="Fill-7" fill="#EE6B47" transform="translate(208.500000, 196.456500) rotate(-90.000000) translate(-208.500000, -196.456500) "></path>
|
||||
<path d="M209.5,62.5 L209.5,32.5" id="Line-2" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M221.2715,195.2195 C221.9275,195.2195 222.4565,195.7755 222.4565,196.4575 C222.4565,197.1385 221.9275,197.6935 221.2455,197.6935 C220.5895,197.6935 220.0595,197.1385 220.0595,196.4575 C220.0595,195.7755 220.5895,195.2195 221.2715,195.2195 L221.2715,195.2195 Z M219.1755,200.6715 C218.4935,200.6715 217.9645,200.1165 217.9645,199.4345 C217.9645,198.7535 218.4935,198.1985 219.1515,198.1985 C219.8325,198.1985 220.3625,198.7535 220.3625,199.4345 C220.3625,200.1165 219.8325,200.6715 219.1755,200.6715 L219.1755,200.6715 Z M219.1755,192.2415 C219.8325,192.2415 220.3625,192.7975 220.3625,193.4785 C220.3625,194.1605 219.8325,194.7155 219.1515,194.7155 C218.4935,194.7155 217.9645,194.1605 217.9645,193.4785 C217.9645,192.7975 218.4935,192.2415 219.1755,192.2415 L219.1755,192.2415 Z M217.6615,195.2955 C218.3185,195.2955 218.8475,195.8505 218.8475,196.5325 C218.8475,197.1885 218.3185,197.7435 217.6365,197.7435 C216.9805,197.7435 216.4495,197.1885 216.4495,196.5075 C216.4495,195.8505 216.9805,195.2955 217.6615,195.2955 L217.6615,195.2955 Z M217.0815,203.6495 C216.4245,203.6495 215.8695,203.0945 215.8695,202.4135 C215.8695,201.7315 216.4005,201.2015 217.0565,201.2015 C217.7375,201.2015 218.2675,201.7315 218.2675,202.4135 C218.2675,203.0945 217.7375,203.6495 217.0815,203.6495 L217.0815,203.6495 Z M217.0815,189.2635 C217.7375,189.2635 218.2675,189.8195 218.2675,190.5005 C218.2675,191.1815 217.7375,191.7375 217.0565,191.7375 C216.4005,191.7375 215.8695,191.1815 215.8695,190.5005 C215.8695,189.8195 216.4245,189.2635 217.0815,189.2635 L217.0815,189.2635 Z M214.9875,206.6275 C214.3305,206.6275 213.7755,206.0725 213.7755,205.3905 C213.7755,204.7105 214.3045,204.1795 214.9605,204.1795 C215.6425,204.1795 216.1725,204.7105 216.1725,205.3905 C216.1725,206.0725 215.6425,206.6275 214.9875,206.6275 L214.9875,206.6275 Z M214.9875,186.2855 C215.6425,186.2855 216.1725,186.8415 216.1725,187.5225 C216.1725,188.2035 215.6425,188.7595 214.9605,188.7595 C214.3045,188.7595 213.7755,188.2035 213.7755,187.5225 C213.7755,186.8415 214.3305,186.2855 214.9875,186.2855 L214.9875,186.2855 Z M214.0015,195.2955 C214.6575,195.2955 215.1885,195.8505 215.1885,196.5325 C215.1885,197.1885 214.6575,197.7435 213.9775,197.7435 C213.3215,197.7435 212.7905,197.1885 212.7905,196.5075 C212.7905,195.8505 213.3465,195.2955 214.0015,195.2955 L214.0015,195.2955 Z M210.3675,195.2955 C211.0245,195.2955 211.5545,195.8505 211.5545,196.5325 C211.5545,197.1885 210.9985,197.7435 210.3425,197.7435 C209.6865,197.7435 209.1305,197.1885 209.1305,196.5075 C209.1305,195.8505 209.6865,195.2955 210.3675,195.2955 L210.3675,195.2955 Z M206.7085,195.2955 C207.3645,195.2955 207.8945,195.8505 207.8945,196.5325 C207.8945,197.1885 207.3645,197.7435 206.6835,197.7435 C206.0275,197.7435 205.4965,197.1885 205.4965,196.5075 C205.4965,195.8505 206.0275,195.2955 206.7085,195.2955 L206.7085,195.2955 Z M203.0485,195.2955 C203.7045,195.2955 204.2355,195.8505 204.2355,196.5325 C204.2355,197.1885 203.7045,197.7435 203.0235,197.7435 C202.3665,197.7435 201.8365,197.1885 201.8365,196.5075 C201.8365,195.8505 202.3925,195.2955 203.0485,195.2955 L203.0485,195.2955 Z M199.4145,195.2955 C200.0705,195.2955 200.6005,195.8505 200.6005,196.5325 C200.6005,197.1885 200.0455,197.7435 199.3885,197.7435 C198.7335,197.7435 198.1775,197.1885 198.1775,196.5075 C198.1775,195.8505 198.7335,195.2955 199.4145,195.2955 L199.4145,195.2955 Z M195.7545,195.2955 C196.4105,195.2955 196.9415,195.8505 196.9415,196.5325 C196.9415,197.1885 196.4105,197.7435 195.7295,197.7435 C195.0735,197.7435 194.5435,197.1885 194.5435,196.5075 C194.5435,195.8505 195.0735,195.2955 195.7545,195.2955 L195.7545,195.2955 Z" id="Fill-7" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(208.500000, 196.456500) rotate(-90.000000) translate(-208.500000, -196.456500) "></path>
|
||||
<path d="M209.5,62.5 L209.5,32.5" id="Line-2" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-2-decoration-1" d="M209.5,32.5 C208.45,36.28 207.55,39.52 206.5,43.3 C208.6,43.3 210.4,43.3 212.5,43.3 C211.45,39.52 210.55,36.28 209.5,32.5 C209.5,32.5 209.5,32.5 209.5,32.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M2.5,171 L415,171" id="Line" stroke="#8A704D" stroke-width="2" stroke-linecap="square"></path>
|
||||
<text id="parentNode" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<path d="M2.5,171 L415,171" id="Line" stroke="#8A704D" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
|
||||
<text id="parentNode" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="172" y="228">parentNode</tspan>
|
||||
</text>
|
||||
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" x="171" y="271" width="75" height="24"></rect>
|
||||
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" x="153" y="136" width="113" height="24"></rect>
|
||||
<rect id="Rectangle-9" stroke="#E8C48E" stroke-width="2" x="153" y="2" width="113" height="24"></rect>
|
||||
<rect id="Rectangle-8" stroke="#E8C48E" stroke-width="2" x="119" y="68" width="194" height="24"></rect>
|
||||
<text id="<DIV>" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
|
||||
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="171" y="271" width="75" height="24"></rect>
|
||||
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="153" y="136" width="113" height="24"></rect>
|
||||
<rect id="Rectangle-9" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="153" y="2" width="113" height="24"></rect>
|
||||
<rect id="Rectangle-8" stroke="#E8C48E" stroke-width="2" sketch:type="MSShapeGroup" x="119" y="68" width="194" height="24"></rect>
|
||||
<text id="<DIV>" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
|
||||
<tspan x="189.051859" y="288"><DIV></tspan>
|
||||
</text>
|
||||
<path d="M208.5,263.5 L208.5,237.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M208.5,263.5 L208.5,237.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-decoration-1" d="M208.5,237.5 C207.45,241.28 206.55,244.52 205.5,248.3 C207.6,248.3 209.4,248.3 211.5,248.3 C210.45,244.52 209.55,241.28 208.5,237.5 C208.5,237.5 208.5,237.5 208.5,237.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M255.5,282.5 L368,282.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M255.5,282.5 L368,282.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-decoration-1" d="M367.5,282.5 C363.72,281.45 360.48,280.55 356.7,279.5 C356.7,281.6 356.7,283.4 356.7,285.5 C360.48,284.45 363.72,283.55 367.5,282.5 C367.5,282.5 367.5,282.5 367.5,282.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<text id="nextSibling" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="nextSibling" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="264" y="268">nextSibling</tspan>
|
||||
</text>
|
||||
<path d="M164.5,282.5 L50,282.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<path d="M164.5,282.5 L50,282.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
|
||||
<path id="Line-decoration-1" d="M50.5,282.5 C54.28,283.55 57.52,284.45 61.3,285.5 C61.3,283.4 61.3,281.6 61.3,279.5 C57.52,280.55 54.28,281.45 50.5,282.5 C50.5,282.5 50.5,282.5 50.5,282.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
|
||||
<text id="previousSibling" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="previousSibling" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="50" y="268">previousSibling</tspan>
|
||||
</text>
|
||||
<path d="M104.5,341.5 L162.5,305.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square"></path>
|
||||
<path d="M313,342 L257.5,305.5" id="Line-3" stroke="#EE6B47" stroke-width="2" stroke-linecap="square"></path>
|
||||
<text id="childNodes" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<path d="M104.5,341.5 L162.5,305.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M313,342 L257.5,305.5" id="Line-3" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
|
||||
<text id="childNodes" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="170" y="323">childNodes</tspan>
|
||||
</text>
|
||||
<text id="firstChild--" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="firstChild--" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="64" y="359">firstChild </tspan>
|
||||
</text>
|
||||
<text id="Type-something" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<text id="Type-something" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
|
||||
<tspan x="279" y="359">lastChild</tspan>
|
||||
</text>
|
||||
</g>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 9.9 KiB |
Loading…
Add table
Add a link
Reference in a new issue