Css красная строка: Как мне для каждого абзаца добавить отступ первой строки?

Содержание

Свойство text-indent | CSS справочник

CSS свойства

Определение и применение

CSS свойство text-indent задает отступ первой строки в текстовом блоке (красная строка).

Поддержка браузерами

CSS синтаксис:

text-indent:"length | initial | inherit";

JavaScript синтаксис:

object.style.textIndent = "40%"

Значения свойства

ЗначениеОписание
lengthОпределяет размер отступа в единицах измерения CSS (px, pt, cm, em, и т.д.). Значение по умолчанию 0.
Допускается использование отрицательных значений, при этом, первая строка будет иметь отступ слева.
%Определяет размер отступа в процентах.
Допускается использование отрицательных значений, при этом, первая строка будет иметь отступ слева.
initialУстанавливает свойство в значение по умолчанию.
inheritУказывает, что значение наследуется от родительского элемента.

Версия CSS

CSS1

Наследуется

Да.

Анимируемое

Да.

Пример использования

<!DOCTYPE html>
<html>
<head>
<title>Свойство text-align.</title>
<style> 
.test {
text-indent : 0px; /* задаём отступ для первой строки текстового блока 0px (это значение по умолчанию). */
width : 500px; /* задаём ширину текстового блока. */
}
.test2 {
text-indent : 40px; /* задаём отступ для первой строки текстового блока 40px. */
width : 500px; /* задаём ширину текстового блока. */
}
.test3 {
text-indent : -20px; /* задаём отрицательный отступ для первой строки текстового блока. */
width : 500px; /* задаём ширину текстового блока. */
}
</style>
</head>
	<body>
		<p class = "test">Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.
</p> <p class = "test2">Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.</p> <p class = "test3">Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.</p> </body> </html>
Пример указания отступа первой строки в текстовом блоке, используя CSS.CSS свойства

Отступ сверху таблицы в html. Отступы и рамки в CSS с помощью параметров margin, padding и border. Как убрать отступы вокруг формы

Блочная верстка частенько используется при создании сайта или блога. Как следствие этого — часто требуется делать отступы у блоков. По этой причине о том, как сделать отступы в CSS подробно описано в данном уроке. Для браузера каждый тег является контейнером, у которого есть содержимое, внутренний отступ, внешние поля, а также рамка. В данном уроке мы научимся делать внутренние и внешние отступы, рассмотрим основные их параметры.

На рисунке ниже наглядно представлены параметры отступов блоков:

Как видно, отступы можно делать в четырех направлениях: верхний отступ (top), нижний отступ (bottom), левый отступ (left) и правый отступ (right). В качестве единиц измерения могут быть пиксели, проценты и другие единицы CSS — подробнее о них . В уроке используются пиксели.

Внутренние отступы блоков

За внутренние отступы в CSS отвечает свойство padding . Итак, давайте рассмотрим пример задания внутренних отступов у блока:

padding-top: 5px; /*верхний внутренний отступ*/ padding-left: 8px; /*левый внутренний отступ*/ padding-right: 8px; /*правый внутренний отступ*/ padding-bottom: 5px; /*нижний внутренний отступ*/

В данном примере внутренние отступы задаются отдельно для каждой стороны блока. Кроме этого, существует несколько способов задания отступов в CSS:

margin: 5px 8px 5px 8px; /*верхний, правый, нижний, левый внешние отступы*/ margin: 5px 8px 5px; /*описывает верхний, левый и правый, нижний отступы*/ margin: 5px 8px; /*описывает верхний и нижний, правый и левый отступы*/ margin: 7px; /*описывает все внутренние отступы по 7px*/

Запомнить проще первый и последний способы. В первом случае отступы ставятся по часовой стрелке (верхний, правый, нижний, левый) — величину отступа мы можем указать любую, в последнем случае отступы со всех сторон будут одинаковые.

Внешние отступы блоков

За внешние отступы в CSS отвечает свойство margin . Примеры внешних отступов в CSS:

margin-top: 5px; /*верхний внешний отступ*/ margin-left: 10px; /*левый внешний отступ*/ margin-right: 10px; /*правый внешний отступ*/ margin-bottom: 5px; /*нижний внешний отступ*/
padding: 5px 10px 5px 10px; /*верхний, правый, нижний, левый внешние отступы*/ padding: 5px 10px 5px; /*описывает верхний, левый и правый, нижний отступы*/ padding: 5px 10px; /*описывает верхний и нижний, правый и левый отступы*/ padding: 7px; /*описывает все внешние отступы по 7px*/

Таким образом, как сделать отступы в CSS — вопрос не сложный, но весьма актуальный. Чтобы лучше усвоить описанную выше информацию следует запомнить, что существует два свойства: padding — внутренние отступы и margin — внешние отступы. Также, как вы уже знаете, способов задания отступов существует несколько, можно их использовать.

Веб-ресурс оценивается пользователями по его внешней привлекательности. Поэтому даже информационно полезный текст может быть не прочитан из-за того, что он некачественно оформлен. Вывод — нужно тщательно и внимательно подходить не только к смысловому содержанию страниц сайта, но и к его визуальному представлению. Появление технологии CSS расширило возможности создания привлекательных статей. Одно из свойств, предназначенных для облегчения восприятия написанного — отступ текста CSS.

Поля и отступы: в чём разница?

Прежде чем начинать форматировать текст, следует разобраться, что такое поля и отступы. Несмотря на то что эти элементы разметки в ряде случаев выглядят для пользователя одинаково, между ними существуют принципиальные различия:

  • поле задаётся свойством padding , отступ — margin ;
  • поле определяется промежутком между содержимым и границей блока, отступ — между границами соседних блоков;
  • поля могут как учитываться в размерах элемента (ширине и высоте), так и нет.

Свойство margin

Итак, чтобы задать горизонтальный или вертикальный отступ текста CSS, используют конструкцию margin . Данное свойство применяется к тегу задающего абзац документа. В самом простом случае оно записывается как:

margin: 12px.

Такая строчка означает, что вокруг блока текста (или любого другого блока) со всех сторон будет сделан отступ в 12 пикселей. Чтобы увеличить промежуток, например, в три раза, достаточно записать:

margin: 36px.

Но что делать, если интервал между блоками должен быть разный с каждой стороны? Разработчики веб-страниц используют несколько форм записи:

  1. margin: 11px 22px.
  2. margin: 11px 22px 33px.
  3. margin: 11px 22px 33px 44px.

В первом примере от нижней и верхней границ блока будут сделаны отступы по 11 пикселей, по бокам блока — по 22 пикселя. Согласно второй форме записи, между верхним краем блока и контентом будет 11 пикселей, между нижним — 33 пикселя, по бокам — по 22 пикселя. В третьем случае отступ будет иметь значение 11 пикселей сверху, 22 пикселя справа, 33 пикселя снизу и 44 пикселя слева.

Также доступна возможность записи расстояния до границы блока только с одной стороны: margin-top, margin-bottom, margin-left, margin-right . Переведя названия свойств на русский язык, несложно догадаться об их назначении. Например, следующая запись говорит о том, что отступ справа будет равен 22 пикселя:

margin-right: 22рх.

Для остальных сторон расстояния вокруг блока принимаются равными значению элемента-родителя.

Свойство margin имеет особенность, которую должен помнить разработчик, когда использует отступ текста CSS по вертикали. Интервалы соседних элементов не суммируются, а налагаются друг на друга. Например, пусть один из блоков имеет

margin-bottom: 15px , а примыкающий к нему снизу блок margin-top: 35px . Школьная арифметика и здравый смысл подсказывают, что общий отступ между ними будет 50 пикселей. На практике это не так. Блок с большим значением свойства margin «поглотит» своего соседа. В итоге интервал между элементами будет 35 пикселей.

«Красная» строка

Оформляя документ в текстовом редакторе, пользователи предпочитают задавать каждый новый абзац с помощью «красной» строки. С помощью CSS отступ текста слева несложно сделать — используется конструкция

text-indent . Записывается она так:

text-indent: 11px.

То есть первая строка абзаца будет сдвинута относительного левого края на 11 пикселей. Чтобы текст на веб-странице больше походил на документ в редакторе, следует дополнительно установить то есть записать:

text-indent: 11px;

text-align: justify.

Помимо пикселей, при описании разметки допускается использование других единиц — дюймов, пунктов, процентов. Пусть блок имеет отступ текста CSS, равный 10%. При ширине блока, равной 500 пикселям, красная строка будет составлять 50 пикселей (10% от 500).

Для данного свойства может быть выставлено значение inherit . Такая запись говорит, что блок использует аналогичное свойство родительского блока.

text-indent: inherit.

Удивительно, но может принимать и отрицательные значения! В этом случае формируются так называемые выступы, то есть основной текст остаётся на месте, а первая строка смещается влево на 22 пикселя:

text-indent: -22px.

Чтобы буквы не перешли за левую границу браузера, дополнительно к text-indent нужно использовать конструкцию для задания поля:

padding-left: 22px.

Основные свойства CSS для рассмотрены. А закрепить их поможет практика. Вот несколько заключительных советов, как применять изученный материал при разработке веб-сайтов:

  • красная строка и отступ текста — разные понятия, и для их указания используются разные свойства;
  • для вертикальных отступов правила математики не действуют — интервалы накладываются, «побеждает» элемент с большим значением;
  • отрицательный абзацный отступ используют, чтобы указать первую строку абзаца с помощью изображения.

Аня написала следующий код (пример 1) и получила страницу, показанную на рис. 1. Но Ане нужно, чтобы не было отступов между блоками, а также справа и слева от блоков. Какие изменения в код для этого требуется внести?

Между заголовком и основным текстом слишком большой отступ, как его уменьшить?

К абзацу (тег

) и заголовку (тег

Когда требуется установить абзацный отступ, лучше всего использовать стилевое свойство text-indent . Его значение определяет насколько сдвинуть текст первой строки вправо от исходного положения. Ширина текстового блока при этом не меняется и остается исходно заданной. Величину отступа можно указывать в пикселах, процентах или других доступных единицах (пример 1).

Как убрать отступ сверху и снизу от списка?

Используйте стилевое свойство margin-top (отступ сверху) и margin-bottom (отступ снизу) для селектора UL или OL , в зависимости от типа списка. Также можно воспользоваться универсальным свойством margin .

Как изменить отступы на веб-странице?

Отступы на веб-странице хотя и не видны, но не позволяют содержимому плотно прилегать к краям окна браузера, чтобы обеспечивать комфортность чтения. Свое собственное значение отступов можно установить, изменяя значения свойства margin у селектора body .

Как убрать отступы вокруг формы?

При добавлении формы через тег

вокруг нее сверху и снизу автоматически добавляются отступы. Чтобы их убрать, используйте стилевое свойство margin с нулевым значением, добавляя его к селектору FORM .

Как изменить расстояние между абзацами текста?

При использовании тега

Автоматически добавляются отступы сверху и снизу от текстового абзаца. Это сделано для того, чтобы визуально отделить один блок текста от следующего. Понятно, что значения отступов, которые заданы по умолчанию, устраивают не всегда, поэтому иногда их приходится уменьшать или увеличивать. Для этого можно использовать универсальное свойство margin , оно определяет отступы со всех сторон абзаца или margin-top для отступа сверху и margin-bottom — для отступа снизу.

Описание

CSS свойство margin-top устанавливает внешний отступ сверху элемента. Отступом является расстояние от внешнего края верхней границы текущего элемента до внутренней границы его родительского элемента либо до границы элемента, расположенного над ним. Обратите внимание, для строчных элементов (display : inline;) могут быть установлены только внешние отступы с левой и с правой стороны.

Размер внешнего верхнего отступа можно указывать в пикселях (px), процентах (%) или в других единицах измерения CSS . Значение может быть как положительным, так и отрицательным.

Примечание: нижний или верхний внешний отступ дочернего элемента может влиять на общую высоту родительского элемента, если у него не задан фиксированный размер высоты.

Объединение полей

  1. Поля сестринских элементов, расположенных один под другим и находящихся в потоке документа, объединяются в одно общее. Высота полученного поля равняется высоте большего из двух полей, например: поле верхнего элемента (margin-bottom) составляет 10px , а нижнего элемента (margin-top) — 20px , единое поле в этом случае будет высотой 20px .
  2. Объединение полей родительского и дочернего элемента, находящихся в потоке документа, происходит, если родительский элемент не имеет ничего из того, что могло бы отделять его внешний отступ от внешнего отступа дочернего элемента (рамки, внутреннего отступа или строчного содержимого). Также объединение полей не будет происходить, если родительскому элементу установить свойство overflow со значением hidden или auto . Плюс от этого способа заключается в том, что размер родительского элемента не увеличивается.

Задача

Убрать отступы вокруг маркированного или нумерованного списка.

Решение

Используйте стилевое свойство margin и padding с нулевым значением для селектора UL или OL , в зависимости от типа списка, как показано в примере 1.

Пример 1. Отступы в списке

HTML5 CSS 2.1 IE Cr Op Sa Fx

Отступы в списке
  • Чебурашка
  • Крокодил Гена
  • Шапокляк

Результат данного примера показан на рис. 1.

Рис. 1. Список без вертикальных и горизонтальных отступов

Обратите внимание, что исчезают маркеры списка, которые оказываются за левым краем веб-страницы. Чтобы убрать только верхний и нижний отступ, не сдвигая при этом список влево, используйте свойства margin-top и margin-bottom (пример 2).

Пример 2. Отступы в списке

HTML5 CSS 2.1 IE Cr Op Sa Fx

Отступы в списке
  • Чебурашка
  • Крокодил Гена
  • Шапокляк

CSS свойство text-indent — Как создать сайт

CSS справочник

Определение и применение

CSS свойство text-indent устанавливает отступ первой строки в текстовом блоке (красная строка).

Поддержка браузерами

CSS синтаксис:

text-indent:"length | initial | inherit";

JavaScript синтаксис:

object.style.textIndent = "40%"

Значения свойства

Значение Описание
length Определяет размер отступа в единицах измерения CSS (px, pt, cm, em, и т. д.). Значение по умолчанию 0.
Допускается использование отрицательных значений, при этом, первая строка будет иметь отступ слева.
% Определяет размер отступа в процентах.
Допускается использование отрицательных значений, при этом, первая строка будет иметь отступ слева.
initial Устанавливает свойство в значение по умолчанию.
inherit Указывает, что значение наследуется от родительского элемента.

Версия CSS

CSS1

Наследуется

Да.

Анимируемое

Да.

Пример использования

<!DOCTYPE html>
<html>
<head>
<title>Свойство text-align.</title>
<style> 
.test {
text-indent : 0px; /* задаём отступ для первой строки текстового блока 0px (это значение по умолчанию). */
width : 500px; /* задаём ширину текстового блока. */
}
.test2 {
text-indent : 40px; /* задаём отступ для первой строки текстового блока 40px.  */
width : 500px; /* задаём ширину текстового блока. */
}
.test3 {
text-indent : -20px; /* задаём отрицательный отступ для первой строки текстового блока. */
width : 500px; /* задаём ширину текстового блока. */
}
</style>
</head>
	<body>
		<p class = "test">Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. 
Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.</p>
		<p class = "test2">Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю. 
Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.</p>
		<p class = "test3">Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.  
Съешь же ещё этих мягких французских булок да выпей чаю. Съешь же ещё этих мягких французских булок да выпей чаю.</p>
	</body>
</html>

Пример указания отступа первой строки в текстовом блоке, используя CSS.

 

CSS справочник

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

Поделиться

Твитнуть

Поделиться

text-decoration-style — CSS: Каскадные таблицы стилей

Свойство CSS text-decoration-style устанавливает стиль строк, заданный параметром text-decoration-line . Стиль применяется ко всем строкам, для которых задано значение text-decoration-line .

Если указанное украшение имеет определенное семантическое значение, например сквозная линия, означающая, что некоторый текст был удален, авторам рекомендуется обозначать это значение с помощью тега HTML, например или . Поскольку в некоторых случаях браузеры могут отключать стили, семантическое значение в такой ситуации не исчезнет.

При одновременной установке нескольких свойств line-decoration может быть удобнее использовать сокращенное свойство text-decoration .

 
стиль оформления текста: твердый;
стиль оформления текста: двойной;
стиль оформления текста: пунктирная;
стиль оформления текста: пунктирная;
стиль оформления текста: волнистый;


стиль оформления текста: наследование;
стиль оформления текста: начальный;
стиль оформления текста: вернуться;
стиль оформления текста: не задано;
  

Значения

твердый

Рисует одну линию.

двойной

Рисует двойную линию.

с точками

Рисует пунктирную линию.

штриховая

Рисует пунктирную линию.

волнистый

Рисует волнистую линию.

-моз-нет

Не рисует линии. Используйте вместо него text-decoration-line : none .

 твердый | двойной | пунктирная | пунктирная | волнистый 

Установка волнистого подчеркивания

 .пример {
       -moz-текст-украшение-строка: подчеркивание;
       -moz-text-decoration-style: волнистый;
       -moz-текст-украшение-цвет: красный;
    -webkit-text-decoration-line: подчеркивание;
    -webkit-text-decoration-style: волнистый;
    -webkit-текст-украшение-цвет: красный;
}
  
CSS
  .wavy {
  текст-украшение-строка: подчеркивание;
  стиль оформления текста: волнистый;
  цвет оформления текста: красный;
}
  
HTML
  

Под этим текстом есть волнистая красная линия.

Результаты

Таблицы BCD загружаются только в браузере

  • При одновременной установке нескольких свойств line-decoration может быть удобнее использовать сокращенное свойство text-decoration вместо этого.

CSS зачеркнутый цвет текста отличается от цвета?

Вопрос задан • 15.03.19

HTML-элементы del, strike или s могут использоваться для эффекта зачеркивания текста.Примеры: del …. дает: del strike и strike …. дает: strike и strike Свойство CSS `text-decoration` со значением` line-through` может использоваться аналогичным образом. . Код … text-decoration: line-through … также будет выглядеть так: text-decoration: line-through Однако зачеркнутая линия обычно имеет тот же цвет, что и текст. Можно ли использовать CSS, чтобы сделать линию другого цвета?

Бенджамин Х.ответил • 02.08.20

Веб-разработчик полного стека с HTML-опытом

Да, вы можете изменить цвет линии на другой с помощью CSS. Вот пример:

<стиль>

пролет. Красный {

оформление текста: сквозное;

цвет: красный;

}

пролет. Синий текст {

цвет: синий;

}

Это мой текст!

Все еще ищете помощь? Получите правильный ответ быстро.

ИЛИ
Найдите онлайн-репетитора сейчас

Выберите эксперта и познакомьтесь онлайн. Никаких пакетов или подписок, платите только за необходимое время.


¢ € £ ¥ ‰ µ · • § ¶ SS ‹ › « » < > ≤ ≥ — — ¯ ‾ ¤ ¦ ¨ ¡ ¿ ˆ ˜ ° — ± ÷ ⁄ × ƒ ∫ ∑ ∞ √ ∼ ≅ ≈ ≠ ≡ ∈ ∉ ∋ ∏ ∧ ∨ ¬ ∩ ∪ ∂ ∀ ∃ ∅ ∇ * ∝ ∠ ´ ¸ ª º † ‡ А Á Â Ã Ä Å Æ Ç È É Ê Ë Я Я Я Я Ð Ñ Ò Ó Ô Õ Ö Ø Œ Š Ù Ú Û Ü Ý Ÿ Þ à á â ã ä å æ ç è é ê ë я я я я ð ñ ò ó ô х ö ø œ š ù ú û ü ý þ ÿ Α Β Γ Δ Ε Ζ Η Θ Ι Κ Λ Μ Ν Ξ Ο Π Ρ Σ Τ Υ Φ Χ Ψ Ω α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ ς σ τ υ φ χ ψ ω ℵ ϖ ℜ ϒ ℘ ℑ ← ↑ → ↓ ↔ ↵ ⇐ ⇑ ⇒ ⇓ ⇔ ∴ ⊂ ⊃ ⊄ ⊆ ⊇ ⊕ ⊗ ⊥ ⋅ ⌈ ⌉ ⌊ ⌋ 〈 〉 ◊

Как создать цветную рамку вокруг текста с помощью HTML и CSS

Обновлено: 10/11/2021, компания Computer Hope

Используя границы, вы можете добавить рамку вокруг текста и установить границу практически любого цвета. Граница на ваших HTML-страницах помогает привлечь внимание к разделу текста или окружить любой другой элемент HTML.

Как показано ниже, рамка может быть создана вокруг любого текста с помощью HTML и CSS на вашей веб-странице. В приведенном ниже примере мы окружили абзац (

) красной рамкой.

Первый пример с текстом, окруженным красной рамкой.
В этом примере также несколько строк.

Для создания приведенного выше примера используется приведенный ниже код.

 

Первый пример с текстом, окруженным красной рамкой.
В этом примере также несколько строк.

В приведенном выше коде стиль определяет размер границы (сокращение от пикселя «px»), тип стиля и цвет границы. Стиль границы — это то, как граница отображается на экране. К другим типам стилей границ относятся пунктирная, пунктирная, двойная, канавка, гребень, врезка и выход. Цвет границы определяет цвет, который вы хотите использовать для границы. В приведенном выше примере используется цветовой код # FF0000, который является цветовым кодом для красного.

Кончик

Граница также может быть применена только к одной стороне.Например, у заголовка этой страницы у нас есть серая линия подчеркивания. Эта линия на самом деле является границей, что достигается с помощью кода CSS border-bottom: 1px solid # 93B0D2; .

Определение стиля с помощью CSS

Внешний вид элементов на веб-странице также может быть определен с помощью встроенного CSS. Встроенный CSS определен в вашем HTML-документе в элементе . Или вы можете определить CSS во внешнем файле с расширением .css . Затем вы можете создать ссылку на этот файл из любого HTML-документа, и элементы в этом документе будут иметь доступ к стилям CSS.Например, с помощью приведенного ниже кода CSS создается новый класс с именем «borderexample», который можно применить к любому другому тегу HTML.

 <стиль>
.borderexample {
 стиль границы: сплошной;
 цвет границы: # 287EC7;
}
 

Используя приведенный выше код, если вы хотите применить этот стиль границы к абзацу HTML, вы можете ввести что-то похожее на пример ниже.

 

Вот пример границы, созданной с помощью CSS

CSS-текст — TutorialBrain

На главную »CSS» Текст CSS

CSS Text — это содержимое веб-сайта.Проще говоря, слова или словарь, который появляется на веб-сайте, — это «ТЕКСТ» в CSS.

Текст может быть предложением, абзацем, телом, строками, контекстом, темой или темой.

Тень текста создает тень вокруг текста. Свойство text-shadow похоже на CSS Text with Shadow.

Синтаксис тени текста:
тень текста : смещение по горизонтали смещение по вертикали радиус размытия цвет ;
text-shadow : начальный ;
тень текста : наследование ;
тень текста : нет ;

Предупреждение / Опасность / Информация / Успех Internet Explorer 9 и более ранние версии не поддерживают свойство тени текста CSS. × Закрыть оповещение

 <стиль>
.h3_text_shadow {
  тень текста: 0.5px 2px 0 # EA1BBE;
}
.p_text_shadow {
  тень текста: 1px 0px оранжевый;
}

 

На данный момент этого достаточно информации о Text Shadow, но если вы хотите узнать больше об этом, нажмите здесь — Advanced CSS Text Shadow.

Цвет текста определяет цвет текста.

Синтаксис цвета текста:
цвет : название цвета | шестнадцатеричный_ код | RGB (RR, GG, BB) | rgba (rr, gg, bb, Alpha) , hsl (h, s, l)

Примечание Цвет текста может быть в —

  • Фактическое название цвета. Пример — синий.
  • Шестнадцатеричный код. Пример — # FF0000 — шестнадцатеричный код красного цвета.
  • RGB, то есть количество красного, зеленого и синего цветов.Пример — RGB (0,255,0) обозначает зеленый цвет.
  • Существуют и другие способы задания значений цвета, такие как rgba, hsl, hsla и т. Д. Подробнее о цветах читайте на странице цветов CSS. × Закрыть оповещение

     <стиль>
    .цвет текста {
      оранжевый цвет;
    }
    
    #text_color_para {
      красный цвет;
    }
    
     

    Text Align устанавливает выравнивание текста. Это способ расположить текст слева, справа или по центру.

    Синтаксис выравнивания текста:
    выравнивание текста : слева;
    выравнивание текста : по центру;
    выравнивание текста : вправо;

     <стиль>
    #text_align_left {
      выравнивание текста: слева;
    }
    
    #text_align_center {
      выравнивание текста: центр;
    }
    
    #text_align_right {
      выравнивание текста: вправо;
    }
    
     

    Направление текста выбирает направление текста.По умолчанию направление текста всегда слева направо.

    Свойство direction устанавливает направление текста в CSS.

    Синтаксис текста Direction:
    direction: ltr; / * Это изменяет направление текста слева направо, и это значение по умолчанию. * /
    направление: RTL; / * Это изменяет направление текста справа налево. * /

    Другой, менее используемый синтаксис Text Direction:
    direction: inherit; / * Получает направление текста от его родителя.* /
    направление: начальное; / * Устанавливает направление в качестве начального значения. * /
    направление: не задано; / * неустановленное направление. * /

    Примечание В большинстве случаев читатели читают слева направо, поэтому в этом случае не требуется устанавливать направление текста, поскольку по умолчанию оно всегда слева направо. × Закрыть оповещение

    Пример направления текста

     <стиль>
    #text_direction_ltr {
      направление: ltr;
    }
    
    #text_direction_rtl {
      направление: RTL;
    }
    
     

    Полужирный текст делает текст полужирным .

    Текст может быть выделен жирным шрифтом с помощью —

    Лучшим из этих двух способов всегда является свойство CSS font-weight.

    Синтаксис полужирного текста с использованием свойства font-weight:
    font-weight : bold ;

    Примечание

  • Если вы хотите пометить текст как жирным и важным , используйте тег .
  • Если вы хотите пометить текст как полужирный и неважный, используйте тег или CSS font-weight: bold
  • × Закрыть оповещение

     <стиль>
    #жирный текст {
      font-weight: жирный;
    }
    
     

    Свойство font-size свойство управляет размером текста, а размер текста в CSS — это способ управления размером шрифта.

    Синтаксис CSS Размер текста:
    font-size: different_font_units;

     <стиль>
    #font_size_length {
      размер шрифта: 20 пикселей;
    }
    
    #font_size_small {
      размер шрифта: маленький;
    }
    
    #font_size_large {
      размер шрифта: большой;
    }
    
    #font_size_percent {
      размер шрифта: 150%;
    }
    
     

    Свойство CSS line-height определяет высоту строки.

    Синтаксис CSS Высота строки:
    высота строки: unit | х% | числовой | обычный;

    • единиц являются допустимыми единицами CSS, такими как пиксели. em, vs, cm и т. д.
    • x — число
    • числовое обозначение любого числа
    • normal — высота строки по умолчанию

    Другой, менее используемый синтаксис Line Height:
    line-height: inherit;
    line-height: начальный;
    line-height: не задано;

     <стиль>
    # line-height-normal {
      ширина: 300 пикселей;
      граница: сплошной красный 1px;
      высота строки: нормальный;
    }
    
    # line-height-length {
      ширина: 300 пикселей;
      граница: сплошной зеленый 1px;
      высота строки: 0.7em;
    }
    
    # line-height-number {
      ширина: 300 пикселей;
      граница: 1 пиксель сплошного синего цвета;
      высота строки: 1,5;
    }
    # line-height-percent {
      ширина: 300 пикселей;
      граница: сплошной желтый 1px;
      высота строки: 60%;
    }
    
     

    Свойство межсловный интервал управляет интервалом между двумя последовательными словами.

    Синтаксис CSS Размер текста:
    интервал между словами: единицы | нормальный | начальный | наследование | отключено;

    Где могут быть доступны единицы измерения, такие как px, em, vw и т. Д.

     <стиль>
    #word_spacing_length {
      межсловный интервал: 20 пикселей;
    }
    
    #word_spacing_normal {
      межсловный интервал: нормальный;
    }
    
    #word_spacing_small {
      межсловный интервал: -0.2em;
    }
    
    
     

    Свойство межбуквенный интервал управляет интервалом между двумя последовательными буквами.

    Синтаксис межбуквенного интервала:
    межбуквенный интервал: единицы | нормальный | начальный | наследование | отключено;
    Где могут быть доступны единицы измерения, такие как px, em, vw и т. Д.

    Пример межбуквенного интервала

     <стиль>
    #letter_spacing_length {
      межбуквенный интервал: 8 пикселей;
    }
    
    #letter_spacing_normal {
      межбуквенный интервал: нормальный;
    }
    
    #letter_spacing_small {
      межбуквенный интервал: -1,5 пикселей;
    }
    
     

    Свойство word-wrap переносит текст.

    Перенос текста разделяет длинные слова и помещает их в следующую строку.

    Синтаксис переноса текста:
    перенос слов : break-word ; / * Чтобы разбить длинные слова на разные строки * /
    перенос слов : обычный ; / * По умолчанию — слово не разделяется, и слово будет отображаться как есть * /

    Другой, менее используемый синтаксис:
    перенос слов : начальный;
    перенос слов : наследование;

     <стиль>
    .default_wrap {
      цвет фона: светло-зеленый;
      максимальная ширина: 250 пикселей;
      граница: 2 пикселя сплошного зеленого цвета;
      перенос слов: нормальный;
    }
    
    .break_word {
      цвет фона: светло-розовый;
      максимальная ширина: 150 пикселей;
      граница: 2 пикселя сплошного зеленого цвета;
      перенос слов: слово-разрыв;
    }
    
     

    Украшение текста украшает тексты. Обычно text-decoration выполняет одно из этих действий —

    • Улучшает текст, обогащая его или украшая его.
    • Удалите существующее оформление текста.

    Синтаксис CSS Text Decoration:
    text-decoration : underline ; / * для подчеркивания текста * /
    text-decoration : none ; / * для удаления существующих украшений текста (по умолчанию) * /

    Менее используемый синтаксис оформления текста:
    text-decoration : overline ; / * рисовать линию поверх текста * /
    text-decoration : до конца строки ; / * провести линию через текст * /

    Пример оформления текста

     <стиль>
    .text_decoration_none {
      текстовое оформление: нет;
    }
    
    .text_decoration_underline {
      текст-оформление: подчеркивание;
    }
    
    .text_decoration_linethrough {
      текстовое оформление: сквозное;
    }
    
    . text_decoration_overline {
      текст-оформление: надстрочный;
    }
    
     

    Свойство -webkit-text-stroke устанавливает обводку вокруг текста, и это контур текста. Это похоже на создание границ вокруг текста.

    Вам необходимо указать ширину и цвет обводки вокруг текста.

    Синтаксис контурного текста (сокращение):
    -webkit текст ход : ширина обводки цвет обводки ; / * Сокращенное свойство контура или обводка текста * /

    Синтаксис свойства отдельного обводки :
    -webkit-text-stroke-width: stroke-width ;
    -webkit-text-stroke-color: -stroke-color ;

    Примечание

  • Контурный текст похож на текстовую границу.
  • Вы также можете использовать свойство text-shadow для создания текстового контура.
  • Используйте -webkit-text-fill-color, чтобы заполнить среднюю часть текста.
  • Текст контура, текст границы и обводки текста — это одно и то же.
  • × Закрыть оповещение

     <стиль>
    .text_stroke {
      -webkit-text-stroke: 1.5px красный;
    }
    
    .text_stroke_individual {
      -webkit-text-stroke-width: 2px;
      -webkit-текст-обводка-цвет: зеленый;
    }
    
    .text_fill_color {
      -webkit-text-fill-color: синий;
      -webkit-text-stroke: помидор 0,5 пикселей;
    }
    
     

    Свойство text-indent устанавливает отступ перед первой строкой в ​​блоке.

    Синтаксис отступа текста:
    отступ текста: x% | длина | начальный | наследование | отключено;
    Где —

    • x может быть положительным или отрицательным числом
    • длина в таких единицах, как px, em, vw и т. Д.
     <стиль>
    .отступ текста {
      граница: 2 пикселя сплошного синего цвета;
      ширина: 500 пикселей;
      текстовый отступ: 40 пикселей;
    }
    
    .text_indent_percent {
      граница: 2 пикселя сплошного синего цвета;
      ширина: 500 пикселей;
      красный цвет;
      отступ текста: -5%;
    }
    
     

    Верхний и нижний регистры текста

    Верхний регистр текста и нижний регистр текста являются частью преобразования текста CSS.

    Свойство text-transform преобразует текст в верхний или нижний регистр.

    text-transform может преобразовывать тексты в любой из этих:

    • Верхний регистр — преобразование всех букв и символов в верхний регистр
    • Нижний регистр — преобразование всех букв и символов в нижний регистр
    • Capitalize — преобразование первого буква текста в верхний регистр
    • none — без преобразования текста
    • full-width: для преобразования текста в полную ширину

    Синтаксис преобразования текста:
    преобразование текста: нет;
    преобразование текста: прописные буквы;
    преобразование текста: нижний регистр;
    преобразование текста: заглавные буквы;
    преобразование текста: во всю ширину;
    преобразование текста: начальное;
    преобразование текста: наследование;
    преобразование текста: отключено;

    Пример преобразования текста

     <стиль>
    . text-transform_none {
      текст-преобразование: нет;
    }
    
    .text-transform_uppercase {
      текст-преобразование: прописные буквы;
    }
    
    .text-transform_lowercase {
      текст-преобразование: нижний регистр;
    }
    
    .text-transform_capitalize {
      текст-преобразование: заглавные буквы;
    }
    
     

    Интервью Вопросы и ответы

    Используя свойство CSS letter-spacing, мы можем дать пробел между буквами слов.

    Например,

     

    TutorialBrain

    Используйте свойство CSS font-size, чтобы увеличить размер текста.

    Пример

     font-size: 20px;
     

    Используя свойство CSS line-height, мы можем дать промежуток между предложениями, которые продолжаются во второй строке.

    Пример

     line-height: 1.5;
     

    Используя свойство Word-spacing, мы можем дать пробел между словами в CSS.

    Пример

     интервал между словами: 20 пикселей;
     

    Чтобы начинать каждую букву слова с большой буквы, используйте свойство text-transform.

    Пример

     text-transform: capitalize;
     
     word-wrap: break-word; / * Чтобы разбить длинные слова на разные строки * /
    перенос слов: нормальный; / * По умолчанию - слово не разделится, и слово будет отображаться как есть * /
    перенос слов: начальный;
    перенос слов: наследование;
     

    Что означает зачеркнутый красным в сетке свойств CSS?

    Инструменты WebDev

    В Visual Studio Orcas сетка свойств CSS отображает красный зачеркнутый текст, когда он хочет сообщить вам, что свойство является либо ненаследуемым , либо заменено правилом с более высоким приоритетом.

    Прочтите всплывающую подсказку, когда вы увидите красный зачеркнутый объект на своем участке, и в нем будет указана точная причина зачеркивания. Вот различные причины, по которым вы можете видеть это зачеркивание красным цветом в таблице свойств CSS.

    1. Свойство переопределяется встроенным стилем

    Вы увидите эту подсказку, когда свойство CSS переопределено встроенным стилем тега HTML. Давайте посмотрим на пример:

    Здесь у нас есть свойство цвета, примененное к элементу управления кнопки HTML через встроенный стиль, а также через атрибут класса. Класс объявлен в блоке стиля.

    Поскольку свойство цвета, установленное во встроенном стиле, имеет приоритет над классом, цвет в MyStyle будет отображаться с красным зачеркиванием.Вы увидите всплывающую подсказку вроде этого:

    2. Свойство переопределяется правилом CSS

    Вы увидите такую ​​всплывающую подсказку, когда свойство CSS переопределено другим правилом CSS.

    В следующем примере свойство «цвет» применяется к DIV, а также устанавливается для элемента управления кнопки HTML в DIV через MyStyle.

    В режиме сводки выберите свойство «цвет» с красной зачеркиванием. Всплывающая подсказка будет иметь следующий вид:

    3.Собственность отменяется правилом, в котором она помечена! Important

    Всплывающая подсказка этого типа отображается, когда свойство CSS переопределяется свойством другого правила CSS, поскольку это свойство помечено как! Important.

    Скажем, у нас

    Привет, мир !!

    , затем текст Hello World !! будет отображаться зеленым, а не красным, несмотря на то, что красный цвет применяется через встроенный.Это потому, что цвет свойства: зеленый помечен как важный. В этом случае всплывающая подсказка будет читать:

    4. Имущество не передается по наследству

    Эта всплывающая подсказка появляется, когда свойство не наследуется дочерними тегами.

    В приведенном ниже примере у нас есть кнопка внутри DIV. Обратите внимание, что свойство height здесь установлено в DIV.

    Теперь, если вы нажмете кнопку и откроете сетку свойств CSS, вы увидите свойство высоты, зачеркнутое красным. Подсказка в этом случае будет читать:

    5. Свойство не наследуется, но может отображаться в дочерних элементах, для которых это свойство не задано

    Это всплывающая подсказка, когда свойство не наследуется дочерними тегами. Это похоже на №4, за исключением того, что это применимо только к background-image и background-color . Для этих свойств значение по умолчанию установлено на none и transparent , поэтому значение родительского тега видно через дочерний тег.

    Привет, мир

    Здесь у нас SPAN внутри DIV. У DIV есть фоновый цвет, установленный с помощью встроенного свойства. Теперь, если вы выберете SPAN и откроете сетку свойств CSS, вы увидите красный цвет фона, зачеркнутый. Подсказка в этом случае будет читать:

    Это все причины, по которым свойство может быть зачеркнуто красным в сетке свойств CSS.

    — от Peter Spada и Reshmi Mangalore

    Инструмент

    Axure-Redline-Tool — npm

    Этот плагин имитирует некоторые функции плагина Measure for Sketch или InVision Inspect. Это приложение предназначено для тех, кто полагается на Axure в своих организациях и хотел бы предоставить разработчикам всегда актуальные спецификации дизайна. Поскольку Axure не поддерживает плагины в самом приложении, этот код находится внутри и применяется к вашим проектам AxShare.

    Супер базовая демонстрация

    Использование плагина

    Последняя версия

      

    Текущая версия

      

    Есть несколько способов использовать этот «установить» этот плагин. Самый простой вариант — скопировать приведенную выше ссылку на скрипт в свой проект AxShare в качестве плагина.Скопируйте сценарий той версии, которую хотите использовать, или просто используйте сценарий с пометкой «последняя», чтобы всегда получать последние обновления приложения. Код в приведенных выше сценариях передается из CDN, чтобы обеспечить быстрый ответ, независимо от вашего местоположения. Если вы предпочитаете размещать код непосредственно в своем проекте AxShare, вам необходимо скопировать и вставить код из /axure-redline-tool/web/plugin.txt в свой проект AxShare в качестве плагина. Комбинация кода получена из структуры разметки, ссылок CDN, соответствующего CSS и поддерживающей базы кода JavaScript / jQuery.

    Чтобы применить этот код к одному из проектов, размещенных на AxShare, перейдите на сайт www. share.axure.com и войдите в свою учетную запись. После входа в систему вы увидите значок встроенной шестеренки справа от каждого проекта Axure. При наведении курсора на этот значок отображается список параметров, включая ПЛАГИНЫ , которые вы должны выбрать. На странице плагина выберите NEW PLUGIN . Назовите свой плагин так, как считаете нужным, и выберите End of the Head в качестве места для вставки.Вставьте свой код plugin.min.htm в область содержимого и сохраните плагин. Выберите все нужные страницы, на которых вы хотите использовать интерактивный инструмент пометок. Если вы хотите, чтобы плагин добавлялся к любым новым страницам, вы можете выбрать Добавить на новые страницы по умолчанию . После сохранения ваш плагин должен быть активирован. Чтобы изменить плагин, просто выберите , отредактируйте и вставьте любой код замены.

    Предыдущие версии

    Учебное пособие по плагину Axure

    Установка / Запуск

    Установите Node. js

    Обновите npm до последней версии:

     $ npm установить npm @ latest -g 

    Чтобы запустить демонстрационный экземпляр плагина в браузере, введите следующие команды:

     $ cd Axure-Redline-Инструмент
    $ npm install
    $ gulp развивать 
    Предпосылки / Зависимости

    Этот проект был построен и протестирован на jQuery 3.2 и Axure RP.

    Плагин Building Modified

    Если вы внесли изменения и хотите создать обновленную версию подключаемого модуля, выполните следующие команды, чтобы сгенерировать подключаемый модуль .txt и plugin.js . Скопируйте содержимое plugin.txt в свой проект AxShare, как показано выше.

    Если вы хотите изменить плагин, для этого доступны два сценария сборки.

    Чтобы быстро внести изменения в производство, введите следующие команды:

     $ cd Axure-Redline-Инструмент
    $ npm install
    $ gulp build-prod 

    Поскольку это скомпилированный плагин, то есть HTML, CSS и JS объединены в один файл, вы также можете постоянно следить за изменениями источника. Затем это автоматически перестроит файл plugin.txt, и вы сможете скопировать код плагина прямо в AxShare. Это не откроет экземпляр плагина в вашем браузере. Для этого введите следующие команды:

     $ cd Axure-Redline-Инструмент
    $ npm install
    $ gulp build-часы 

    Ошибки / Недостатки

    Поскольку этот код встроен в проекты Axure, он не имеет прямого контроля над тем, как активы экспортируются из Axure. Кроме того, проекты Axure предоставляют гораздо больше функциональности и интерактивности, чем те, которые созданы в Sketch, и их сложно перехватить и взаимодействовать с ними.Код делает все возможное для обработки различных вложенных элементов, экспортированных из Axure, но если вы столкнетесь с проблемой, сообщите мне, и я незамедлительно ее решу.

    При первом использовании размер созданной монтажной области может показаться странным. Этот инструмент сканирует все элементы страницы и определяет размер монтажной области на основе самых крайних элементов. Если вам нужен артборд определенного размера, я бы предложил использовать фоновый прямоугольник в Axure, чтобы определить это. В качестве альтернативы вы можете использовать комбинацию вертикальных и горизонтальных линий для определения границы монтажной области.Например, если вам нужен артборд размером 1000 пикселей x 1000 пикселей, поместите прямоугольник в качестве самого заднего элемента в вашем проекте Axure с координатами X и Y, равными 0, и размерами 1000 пикселей x 1000 пикселей.

    * Axure предпочитает экспортировать некоторые общие элементы, такие как круги и линии, как изображения вместо использования CSS. Таким образом, вам может быть трудно найти точные размеры некоторых предметов. Обходной путь для кругов — поместить квадрат в Axure и установить радиус границы больше или равный 50% размеров квадрата.Затем он будет экспортирован как элемент HTML. Axure также испытывает трудности с экспортом элементов с множеством атрибутов границ и тенями блоков. Обычно он экспортирует их как изображения, и вы не сможете получить какие-либо атрибуты CSS.

    Ближайшие особенности

    • Предоставить нарезанные изображения
    • Цветовая палитра документа

    Управление версиями

    Мы используем SemVer для управления версиями.

    Авторы

    См. Также список участников, участвовавших в этом проекте.

    Лицензия

    Этот проект находится под лицензией MIT License — подробности см. В файле LICENSE.

    История изменений

    Версия 1.1
    • Решена проблема переполнения прокрутки содержимого, влияющая на размер монтажной области. В терминах Axure, скрытое содержимое динамической панели больше не приводит к тому, что сгенерированный монтажный стол больше, чем видимые элементы.
    • Решено, как инструмент обрабатывает аннотации Axure. Аннотации можно читать, пока инструмент отключен.Пока инструмент включен, их значки не считаются интерактивными элементами.
    • Добавлены функциональные возможности клавишных команд для поддержки элементов управления масштабированием с помощью клавиш [Ctrl +] / [Ctrl -] и Esc, чтобы закрыть панель инструментов красной линии / отменить выбор элемента.
    • Добавлена ​​поддержка отслеживания масштабирования, чтобы обеспечить сохранение текущего уровня масштабирования во время прохождения потоков.
    Версия 1.1.1
    • Пересмотренный код для решения проблем рендеринга монтажной области. Axure использует изображения вместо CSS для многих распространенных элементов, таких как линии и круги.Эти экспортированные изображения часто имеют неправильные размеры, из-за чего инструмент красной линии неправильно определяет размер монтажной области. Код был изменен соответствующим образом, чтобы справиться с этими сценариями.
    • Инструмент теперь удаляет фокус элемента при прокрутке страницы. Из-за этой проблемы оранжевое поле выбора оставалось фиксированным при прокрутке элемента ниже. Код в настоящее время закрывает инструмент пометок при прокрутке. Позднее усовершенствование будет заключаться в привязке оранжевого поля выбора к выбранному элементу, чтобы оно оставалось даже при прокрутке.
    Версия 1.1.2
    • Скрипты сборки перенесены с Grunt на Gulp. Теперь доступны дополнительные параметры сборки, а внедрение кода улучшено.
    Версия 1.1.3
    • Предусмотрен предварительный просмотр образцов цвета для атрибутов цвета и цвета фона.
    • Теперь поддерживает HEX и RGB (A). Цветовые форматы можно переключать, щелкая образец цвета.
    Версия 1.1.4
    • Обеспечена поддержка виджетов ретранслятора.Обновлен код для игнорирования встроенных скриптов и тегов стилей.
    • Добавлен атрибут размера поля для входных данных, чтобы обеспечить правильный размер во всех браузерах.
    Версия 1.2
    • Изменен способ расчета межэлементных размеров. Раньше повторялись все элементы и добавлялись атрибуты данных. Теперь это делается в режиме реального времени только для активных элементов. Это повысит производительность на страницах с большим количеством элементов.
    • Решена проблема, из-за которой инструмент отображал непредусмотренное скрытое содержимое.
    • Исправлены небольшие изменения стиля CSS для улучшения согласованности при отображении атрибутов.
    • Решена проблема, из-за которой инструмент выдает ошибку при отключении, когда элемент выбран.
    • Инструмент
    • теперь обеспечивает правильное заполнение монтажной области при масштабировании.
    • Устранено мерцание измерения, возникавшее при наведении курсора на линию измерения или метку.
    Версия 2.0.1
    • Имена компонентов Axure — теперь инструмент будет отображать любые имена элементов, которые вы использовали в своем проекте.
    • Аннотации всегда доступны для щелчка — примечания всегда доступны для нажатия, даже если инструмент включен.
    • Перемещение переключателя красной линии — переключатель включения инструмента красной линии перемещен в верхний заголовок для лучшей видимости.
    • Показать атрибуты псевдокласса — инструмент теперь предоставляет CSS для тех псевдоклассов, которые предоставляет Axure.
    • CDN Link — инструмент теперь можно обслуживать по ссылке CDN, что означает более быстрое время загрузки и отсутствие копирования огромных блоков кода.
    • Взаимодействие с горячими клавишами — теперь больше не требуется отключать инструмент для взаимодействия с элементами Axure.Удерживая нажатой [Ctrl] (Windows) или [⌘] (Mac), вы можете наводить курсор на элементы или щелкать по ним.
    • Business / Developer Links — инструмент теперь предлагает ссылки для обмена как для бизнеса, так и для разработчиков. Деловая ссылка не позволит инструменту даже отображаться на странице. Это гарантирует отсутствие путаницы при передаче прототипов бизнесу.
    • Loading Spinner — на больших страницах инструмент может занять довольно много времени для рендеринга монтажной области. Счетчик загрузки помогает указать фоновое действие.
    • Образцы цвета — Обновленный код для обработки образцов цвета для любого атрибута CSS, содержащего цвет.
    • Parent Opacity — при настройке непрозрачности для всего элемента в Axure она применяется только к родительскому элементу. Теперь инструмент может точно извлекать эту информацию.
    Версия 2.0.3
    • Добавлено поле свойств блока CSS для упрощения вырезания и вставки.
    Версия 2.0.4
    • Когда цвета RGBA отображаются с непрозрачностью 1, мы теперь конвертируем их в RGB.
    • Если непрозрачность атрибута CSS равна 1, теперь мы не беспокоимся о его отображении.
    • Устранена ошибка в Microsoft Edge, создающая проблемы при отображении значений цвета RGBA.
    Версия 2.0.5
    • При совместном использовании бизнес-ссылки аннотации по умолчанию отключены через интерфейсную панель AxShare.
    Версия 2.0.6
    • Пересмотрено, как формируются ссылки общего доступа для размещения ссылок на серверы частного предприятия.
    Версия 2.0,7
    • Исправлена ​​загрузка страницы шрифтов HTML, CSS и Google. Загрузка шрифтов приводила к неправильным измерениям элементов в jQuery.
    • Обновлен CSS для поддержки создания артбордов RP9.
    • Обновлено для поддержки аннотаций RP9.
    Версия 3.0.0
    • Приложение перенесено на React.
    • Незначительные изменения пользовательского интерфейса.
    • Поддержка наложения сетки.
    Версия 3.0.1
    Версия 3.0.2
    • Добавлена ​​поддержка встроенного инструмента проверки и Axure Cloud.
    Версия 3.0.3
    • Исправлена ​​проблема с модальным телом заставки.
    Версия 3.0.4
    • Устранены ошибки взаимодействия с помощью встроенного инструмента проверки.
    • Устранена ошибка щелчка по отступу артборда.
    • Пересмотренные инструменты сборки для поддержки устаревших версий, гарантирующие отсутствие критических изменений.
    Версия 3.0.5
    • Удалена функция щелчка из #base, которая, по сути, является монтажной областью, с которой не следует взаимодействовать.
    • Добавлена ​​непрозрачность артборда #base, чтобы он больше походил на неинтерактивный элемент.
    Версия 3.0.6
    • Добавлены дополнительные функции для поддержки прыжковой монтажной области в проектах RP9 и проектах с использованием встроенного инструмента проверки.
    Версия 3.0.7
    • Исправлена ​​конфигурация цвета фона монтажной области. Для неопределенных цветов фона артборда он отображается как прозрачный белый. В противном случае используется цвет, определенный пользователем.
    • Добавлена ​​функциональность в сценарий dev-live для поддержки обслуживания настраиваемого URL-адреса.
    Версия 3.1.0
    • Исправленное сопоставление имен цветов CSS — Инструмент Redline поддерживает использование имен цветов CSS вместо шестнадцатеричных / RGB-значений. Алгоритм сопоставления, отображающий образец для данного цвета, частично совпадал с другими словами. Это означало, что если значение поля было скучно , был применен образец цвета красный .
    • Добавлена ​​поддержка модальной проверки — модальные окна или другие элементы, выходящие за рамки обычного потока страниц, неправильно считывались инструментом.С технической точки зрения это происходило с элементами с position: fixed; .
    • Цвет границы
    • показан без границы — на текстовых блоках инструмент считывал цвета границы без определения стиля границы. Нет причин отображать этот атрибут без определенного стиля границы .
    • Text Shadow Attribute — Добавлен CSS-атрибут text-shadow в список.
    • Расширенная поддержка индивидуального стиля слова — если вы попытались стилизовать одно слово по-другому в текстовом блоке, применив, например, другой цвет или толщину шрифта, это привело бы к тому, что стилизованное слово вырвалось из текстового блока.С технической точки зрения это произошло из-за того, что мы устанавливали элементов на display: inline-block; . Это было сделано для того, чтобы мы могли точно измерить их высоту, ширину и положение. Теперь для этих элементов мы не будем показывать высоту, ширину или положение, потому что они не несут никакой информации. Вместо этого мы выбираем родительский контейнер, который обычно является тегом

      .

    • Отключить концепцию артборда — инструмент красной линии пытается имитировать концепцию артборда, используемую во многих других инструментах.Он представлен как плавающая полупрозрачная центрированная доска. Некоторые пользователи имеют очень большие документы или не предпочитают эту концепцию.
    Версия 3.1.1
    • Перенесено с Gulp на npm для всех задач сборки и разработки
    • Обновленные зависимости
    • Добавлены атрибуты CSS letter-spacing и text-transform
    • Добавлен postcss для поддержки устаревшего браузера

    Изменения в тегах EDGAR Redline

    С выпуском EDGAR 20.3, будут внесены изменения в способ, которым податели заявок могут отредактировать исправления в своих представлениях в систему EDGAR. Эти изменения позволяют вносить изменения во встроенном XBRL. Существующие теги редакции исторически размещались свободно вокруг текста, который был изменен для обозначения редакции. Кроме того, вместо тегов можно использовать прерванные символы, & ltR & gt и & lt / R & gt. Ни один из этих методов неприемлем для встроенных файлов XBRL, поскольку они оба нарушают жесткие требования XHTML этого формата.


    Новые правила в руководстве EDGAR Filer Manual (EFM) диктуют важные изменения, которые позволяют отмечать исправления в файлах iXBRL.

    Традиционные HTML-файлы EDGAR

    Согласно EFM, теги исправлений в традиционных HTML-файлах ASCII / EDGAR остаются неизменными. Пользователи могут размещать теги исправлений ( и ) вокруг информации, которую они хотят указать, что была исправлена. Например, в HTML:

    Информация в этом разделе почти достоверна.

    или:

    Информация в этом разделе & ltR & gtпочти & lg / R & gt определена.

    Как всегда, теги исправлений удаляются перед распространением, не оставляя возможности определить их местонахождение.

    Redlining во встроенном XBRL

    В соответствии с разделом 5.2.5.16 EFM, красный текст должен быть обозначен с помощью настраиваемого свойства CSS: -sec-ix-redline. Это свойство должно быть установлено в значение «true», чтобы обозначить текст с исправлением. Пользователи могут поместить это свойство в атрибут STYLE вместе с другими свойствами CSS.Обычно это свойство CSS может использоваться с атрибутом STYLE тега SPAN для обозначения встроенных версий. Например:

    Информация в этом разделе почти определена.

    Пользовательское свойство CSS -sec-ix-redline может использоваться с любым атрибутом STYLE. Как и в случае с традиционными тегами , свойство -sec-ix-redline не распространяется как часть документа. Свойство удалено, поэтому невозможно определить его местонахождение.Другие свойства CSS распространяются как есть. Если свойство является единственным свойством CSS, указанным в атрибуте STYLE, весь атрибут будет удален.

    GoFiler следует EFM в обработке форматирования EDGAR и iXBRL.

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *