Эффект подчёркивания при наведении на ссылку

Содержание

Как убрать синюю линию в тексте

Когда в документе есть синяя волнистая линия – это знак неправильного форматирования. Если одна часть текста с одним шрифтом, а вторая часть с другим, тогда появится синяя волнистая линия. Убрать синюю линию можно просто, применив ко всему тексту один шрифт. Либо воспользоваться тремя способами, которые описаны ниже.


 Кликните по синему месту правой кнопкой мыши и выберите нужный вариант:

  1. «Заменить прямое форматирование стилем Основной текст» — к тексту применится основной шрифт, который преобладает у большей части статьи.
  2. «Пропустить» — формат текста не изменится, но синяя волнистая линия удалится.
  3. «Пропустить правило» — будут пропущены все последующие участки с проблемным форматированием.

Как убрать подчеркивание в Word: настройка форматирования

Подчеркивание возникает после копирования текста из других источников (файлов или веб-сайтов), в некоторых случаях программа выставляет его автоматически. Пример – гиперссылки. По умолчанию приложение, определив, что фрагмент является путём к внешнему ресурсу, перекрашивает его в синий цвет, делает подчёркивание и проставляет ссылку.

Если под словом находится линия, самый простой способ её удалить – изменить параметры начертания текста. Сделать это можно, используя инструмент вкладки «Главная», который визуально представляется собой кнопку с буквой «Ч». В англоязычной версии программы этой функции соответствует кнопка «U».

Вот последовательность действий, которая приведёт к требуемому результату:

  • выделить текст;
  • на вкладке «Главная» сделать неактивной кнопку «Ч», нажав на неё мышкой.

Продвинутые пользователи знают, как убрать подчеркивание в Word быстрым способом, и применяют для его снятия клавиши <Ctrl + U>.

CSS оформление ссылок: убираем подчёркивание, меняем цвет

Селекторы псевдо-классов

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

span:hover { color: red; }

Ссылки

Чаще всего селекторы псевдо-классов можно встретить, когда они применяются к ссылкам. Каждая ссылка может находиться в одном из четырех состояний: непосещённая, посещенная, активная (находящаяся под курсором мыши) и нажатая (удерживаемая кнопкой мыши). В CSS есть возможность стилизовать ссылку в каждом ее состоянии:

a:link { color: #0000ff; }

a:visited { color: #ff00ff; }

a:hover { color: #00ccff; }

a:active { color: #ff0000; } 

Примечание: :hover, помимо ссылок, можно использовать и с другими элементами, что позволяет создавать эффекты вроде подсветки строки таблицы при наведении на нее курсора мыши. Однако браузер IE6 и более ранние версии поддерживают использование данного псевдо-класса исключительно с элементами <a>.

Подчеркивание ссылок

По умолчанию текст ссылок всегда отображается подчеркнутым. Используя свойство text-decoration вы можете либо совсем убрать подчеркивание ссылок либо сделать так, чтобы ссылка была подчеркнутой, только при наведении на нее курсора мыши.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Название документа</title>
    <style>
      a { text-decoration: none; } 
      a:hover { text-decoration: underline; }  
    </style>
  </head>

  <body>
    <p><b><a href="#">обычная ссылка</a></b></p>
  </body>
</html>

Примечание: если подчеркивание ссылок отключается с помощью свойства text-decoration, то единственным визуальным отличием между ссылками и обычным текстом будет их цвет. Это может привести к тому, что пользователям может быть трудно отличить ссылки от текста.

Псевдо-классы :first-child и :last-child

Еще одним примером псевдо-классов являются :first-child и :last-child. Псевдо-класс :first-child ссылается на первый по порядку дочерний элемент обозначенного родителя, в отличие от него :last-child работает наоборот, он ссылается на последний дочерний элемент:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Название документа</title>
    <style>
      div p:first-child { color: green; }
      div p:last-child { color: blue; }  
    </style>
  </head>

  <body>
  
    <div>
      <p>Первый дочерний абзац элемента div, он будет отображаться зеленого цвета.</p>
	  
	  <p>Второй дочерний абзац элемента div, он будет отображаться черного цвета,
	  поскольку никаких правил для него не задано.</p>
	  
	  <p>Третий дочерний абзац элемента div, он же является последним дочерним абзацем.
	  Цвет текста будет синим.</p>
    </div>
	
  </body>
</html>

Поскольку первый абзац является первым дочерним элементом для <div>, его текст будет отображаться зеленым цветом. Цвет текста второго абзаца будет соответствовать цвету заданному по умолчанию, то есть черному. Цвет текста третьего абзаца будет окрашен в синий цвет, поскольку третий абзац является последним дочерним элементом для <div>.

Как убрать красные подчеркивания в Word?

Это самый простой вопрос. Как убрать подчеркивание в Word красного цвета, знают все, кто работает с программой не первый день. Красный цвет в данном текстовом редакторе — самый распространенный маркер. Он указывает на то, что в подчеркнутом тексте находится какая-то ошибка. Точнее, не какая-нибудь, а одна из этих:

  • подчеркнутое слово отсутствует в словаре,
  • слово написано с ошибкой,
  • также красным Word подчеркивает повторения.

Если вы не понимаете, что за ошибка в этой части текста, нажмите на него правой кнопкой. Встроенный инструмент проверки орфографии поможет вам разобраться.

Стоит отметить, что также ошибки могут быть подчеркнуты зеленым цветом. Это указывает на проблемы с использованием знаков препинания, несогласованность, стилистические ляпы и прочее.

Есть два варианта, как можно справиться с подчеркиванием красного или зеленого цвета:

  1. Чтобы убрать такое подчеркивание, достаточно исправить ошибки.
  2. Также можно нажать на «Пропустить», чтобы программа проверки перестала «видеть» этот участок.

text-decoration — подчёркнутый и зачёркнутый текст

Описание

CSS свойство позволяет добавить к тексту такие элементы декора как подчёркивание, надчёркивание и перечёркивание (то есть сделать зачёркнутый текст).

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

Самый часто используемый декор для текста — это подчёркивание. Подчёркнутый текст задаётся значением :

/*делаем подчёркнутый текст*/
span {text-decoration: underline;}

Если вам, наоборот, нужно убрать подчёркивание, например убрать подчеркивание ссылки, заданное по умолчанию, то нужно воспользоваться значением :

/*убираем подчёркивание ссылок*/
a {text-decoration: none;}

Часто требуется не просто убрать подчёркивание ссылки в обычном состоянии, а сделать так, чтобы ссылки были подчёркнуты при наведении на них курсора мыши. Чтобы сделать подчёркивание ссылки при наведении, надо воспользоваться псевдо-классом :hover:

/*убираем подчёркивание ссылок*/
a {text-decoration: none;}

/*задаём подчёркивание ссылок при наведении*/
a:hover {text-decoration: underline;}

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

Примечание: чтобы добавить к тексту подчёркивание или перечёркивание не обязательно использовать CSS, этих же эффектов можно добиться с помощью HTML тегов: <u> (подчёркнутый текст) и <del> (зачёркнутый текст).

Значение по умолчанию: none
Применяется: ко всем элементам, а также к псевдо-элементам ::first-letter и ::first-line
Анимируется: нет
Наследуется: нет
Версия: CSS1
Синтаксис JavaScript: object.style.textDecoration=»overline»

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

Значение Описание
none Оставляет текст без изменений.
underline Определяет горизонтальную линию под текстом.
overline Определяет горизонтальную линию над текстом.
line-through Определяет линию перечеркивающую текст.
inherit Указывает, что значение наследуется от родительского элемента.

Как исправить ошибки в Ворде во всем тексте сразу

Для начала был взят, отправленный мне вордовский текст с ошибками (текст, сделанный в Microsoft Office Word 2016) и через сервис SmallPDF преобразован в PDF файл. Вновь созданный PDF файл смотрелся отлично – таблицы были ровными, картинки на правильных позициях, а отсутствие пробелов исчезло. Это хорошо, но мне нужно было еще поработать с текстом в Word. Для этого нужно было вернуть документ снова в Ворд.

Были сомнения, получится ли получить корректный текст в Ворде. С помощью этого же сервиса SmallPDF был преобразован ранее полученный файл ПДФ снова в Ворд 2007. Полученный после конвертации текст в Word был ровным, ошибок не было, а картинки стояли на своем месте.


Чтобы конвертировать файлы Word в PDF и наоборот, нужно выбрать в сервисе SmallPDF «Все инструменты» в верхней части страницы.

Далее просто перетащите нужный файл мышкой в окно программы и включите конвертацию. Для примера можете использовать статью на блоге Онлайн конвертер ppt в pdf.

Вы можете оценить сами, как было до и как стало после на представленных скриншотах:

Скрин 3.

Скрин 4.

Ссылки без подчёркивания

Подчёркивание текстовых ссылок уже стало определённым стандартом и сигналом о том, что это не просто текст, а именно ссылка. Это, кстати, является одной из причин, по которой не следует применять подчёркивание к обычному тексту, — пользователи будут считать, что имеют дело со ссылкой. Наряду с использованием подчёркивания благодаря CSS у разработчиков сайтов появился и альтернативный вариант — создание ссылок без подчёркивания. При правильном применении такое оформление ссылок даже может придать сайту определённый эффект. Только надо обязательно дать понять пользователю, что является ссылкой, а что обычным текстом, разграничивая их, например, цветом. Ещё можно сделать так что при наведении курсора ссылка становится подчёркнутой, меняет свой цвет или используется и тот, и другой эффект одновременно.

Чтобы убрать подчёркивание у ссылки, следует в стилях для селектора a добавить text-decoration со значение none (пример 1).

Пример 1. Отсутствие подчёркивания у ссылок

<!DOCTYPE html> <html> <head> <meta charset=»utf-8″> <title>Ссылки</title> <style> a { text-decoration: none; /* Убираем подчёркивание */ } </style> </head> <body> <p><a href=»link.html»>Ссылка без подчёркивания</a> </body> </html>

Для псевдоклассов :hover и :visited нет необходимости добавлять text-decoration, они наследуют свойства селектора a.

Подчеркивание содержимое ячейки, все ячейки или строк на листе

​ вас актуальными справочными​​ косвенно связан с​ больше) единицы, то​ зачёркнутым шрифтом. Выделяем​: Спасибо, то что​ текст автоматически в​ , Грошев С.​ видоизменение​Откроется панель​На вкладке​Шрифт​ SHIFT + клавиши​ щелкните ячейку и​ оригинал (на английском​ Microsoft Excel.​ сочетание клавиш CTRL+5.​ например, показать изменение​ материалами на вашем​ темой?​ текст становится не​ первую из них,​ нужно.​

​ ячейке A1, если​ В. MS Office:​Королёв александр​Средства рисования​Вставка​, а затем в​ со стрелками, чтобы​ выберите текст или​ языке) .​Примечание:​

Подчеркивание все или выбранного содержимого ячейки

​В диалоговом окне​ данных в ячейке​

​ языке. Эта страница​Sanja​ зачеркнутым.​ прокручиваем список до​C1rcle​

​ в ячейку B1​ Excel. Excel для​: Формат — Ячейки​, содержащая вкладку​в группе элементов​ диалоговом окне​

​ выделить содержимое.​ числа, которые нужно​Существует несколько способов добавления​Мы стараемся как​Формат ячеек​ или завершенные задачи.​ переведена автоматически, поэтому​: Никак. Считайте количество​JeyCi​ конца, удерживаем Shift​: Добрый день! Хотел​ ведено слово «Выполнено».​ бухгалтера в примерах.​ — Шрифт -​Формат​Иллюстрации​подчеркивания​На вкладке​ подчеркнуть.​ подчеркивание к данным​

​ можно оперативнее обеспечивать​​на вкладке​​Если у вас есть​​ ее текст может​​ ячеек по тому​: Условное Форматирование​

​ и кликаем мышкой​ узнать, возможно ли​​ Спасибо за ответ.​ ​Электронный учебник «Excel​

​ Зачеркнутый (сначала выдели​.​нажмите кнопку​Выберите стиль, который​Главная​Включения редактирования в ячейке,​ на лист. Можно​​ вас актуальными справочными​​Эффекты​​ классическое приложение Excel,​ содержать неточности и​​ условию, по которому​​или файл-пример приложите,​ по последней ссылке.​

Подчеркивание всей ячейки или строки с помощью нижняя граница

​ как-нибудь с помощью​AlexM​ XP»​ ячейку где надо​На вкладке​Фигуры​ вы хотите использовать.​

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

Нарисуйте линию, чтобы подчеркнуть ячеек

​ согласно​​ На листе выделятся​​ фильтра или какой-то​​: Смотрите условное форматирование​​Несколько книг по​​ зачеркнуть)​​Формат​

​.​​Выделите ячейку, диапазон ячеек​​Шрифт​​ можно выбрать содержимое​

​ или выделенного текста​ языке. Эта страница​

​Зачеркнутый.​ нем книгу и​ нас важно, чтобы​БМВ​Юрий М​

​ все соответствующие ячейки​ формулы найти в​Mult1plexer​


​ Excel​​Вячеслав суворов​​в группе​​В разделе​​ или строк, которые​

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

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

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

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

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

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

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

  2. На вкладке Вставка в группе Иллюстрации нажмите кнопку Фигуры, а затем в разделе Прямоугольники выберите пункт Прямоугольник.

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

  4. Щелкните прямоугольник правой кнопкой мыши и выберите пункт Формат фигуры.

  5. В области Формат фигуры сделайте следующее:

    1. В разделе Заливка выберите параметр Нет заливки.

    2. В разделе Линия выберите вариант Нет линии.

  6. Щелкните прямоугольник (но не текст внутри нее), а затем на вкладке Вставка в группе Ссылки нажмите кнопку Гиперссылка.

  7. Введите веб-адрес в поле Адрес и нажмите кнопку ОК.

  8. Чтобы проверить гиперссылку, в нижней части окна слайда щелкните Показ слайдов.

  9. Щелкните прямоугольник, в котором находится гиперссылка.

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

  2. На вкладке Вставка в группе Иллюстрации нажмите кнопку Фигуры, а затем в разделе Прямоугольники выберите пункт Прямоугольник.

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

  4. Щелкните прямоугольник правой кнопкой мыши и выберите команду Формат фигуры. В диалоговом окне Формат фигуры выполните указанные ниже действия.

    1. В левой области выберите заливки, в правой области нажмите кнопку цвет и выберите нужный цвет, который соответствует фоне вашей презентации.

    2. В левой области нажмите кнопку Цвет линии, в правой области нажмите кнопку без линии и нажмите кнопку Закрыть.

  5. Щелкните прямоугольник правой кнопкой мыши, выберите команду Изменить текст и введите текст, который вы хотите использовать для гиперссылки.

    Примечание: Если по мере ввода текста не отображается, выделите текст. Если вы хотите изменить цвет или форматирования текста, выделите текст и на вкладке Главная в группе Шрифт нажмите кнопку Диалогового окна.

  6. Щелкните фигуру (но не текст внутри нее), а затем на вкладке Вставка в группе ссылки выберите команду Гиперссылка.

  7. Введите веб-адрес в поле Адрес и нажмите кнопку ОК.

  8. Чтобы проверить гиперссылку, в режиме слайд-шоу, щелкните прямоугольник, содержащую гиперссылку.

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

Примеры использования text-decoration

Пример №1. Убираем подчеркивание у ссылки

Рассмотрим первый вариант, в котором мы зададим общий (шаблонный) стиль для ссылок (цвет и размер) и еще зададим два класса ссылок. Класс podcherk включает ссылке подчеркивание, а notpodcherk соответственно убирает подчеркивание. Следующий код демонстрирует это:

Вот во что преобразуется этот код:

Пример №3. Делаем красивое подчеркивание

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


Преобразуется на странице в:

Вот в принципе и все самые интересные примеры по подчеркиванию ссылок. Главным ответом на вопрос этой статьи служит строка: text-decoration: none (убирает подчеркивание).

В самом популярном текстовом редакторе MS Word присутствуют встроенные средства для проверки правописания. Так, если включена функция автозамены, некоторые ошибки и опечатки будут исправляться автоматически. Если же программа обнаруживает в том или ином слове ошибку, а то и вовсе не знает его, она подчеркивает это слово (слова, фразы) красной волнистой линией.

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

1. Откройте меню “Файл” , нажав на крайнюю левую кнопку в верхней части панели управления в Word 2012 — 2016, или нажмите на кнопку “MS Office” , если вы используете более раннюю версию программы.

2. Откройте раздел “Параметры” (ранее “Параметры Word” ).

3. Выберите в открывшемся окне раздел “Правописание” .

4. Найдите раздел “Исключение для файла” и установите там галочки напротив двух пунктов “Скрыть… ошибки только в этом документе” .

5. После того, как вы закроете окно “Параметры” , вы больше не увидите в данном текстовом документе навязчивых красных подчеркиваний.

Добавляем слово с подчеркиванием в словарь

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

1. Кликните правой кнопкой мышки на подчеркнутом слове.

2. В появившемся меню выберите необходимую команду: “Пропустить” или “Добавить в словарь” .

3. Подчеркивание исчезнет. Если это необходимо, повторите пункты 1-2 и для других слов.

Собственно, вот и весь секрет того, как убрать подчеркивание в Ворде. Теперь вы знаете больше об этой многофункциональной программе и даже знаете, как можно пополнить ее словарный запас. Пишите грамотно и не допускайте ошибок, успехов вам в работе и обучение.

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

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

Подчеркнутый текст может сложнее читаться, чем обычный. Многие дизайнеры просто не уделяют этому должного внимания. Но можно полностью удалить подчеркивание. Для этого мы будем использовать свойство CSS text-decoration . Вот CSS-код , с помощью которого это можно сделать:

a { text-decoration: none; }

С помощью этой строки кода можно удалить CSS underline style всех ссылок.

Предостережение относительно удаления подчеркивания

Нравится вам подчеркивание или нет, нельзя отрицать того, что оно позволяет указать на связь текста со ссылкой. Если убрать подчеркивание или изменить синий цвет ссылок, то нужно предоставить взамен стили, которые позволяют выделить текст ссылок. Это сделает взаимодействие посетителей с сайтом интуитивным.

Не подчеркивайте текст, не связанный со ссылкой

Не подчеркивайте текст, который не является ссылкой. Люди привыкли к тому, что подчеркнутый текст (с помощью CSS underline color

) является ссылкой

Если вы подчеркиваете контент, чтобы акцентировать на нем внимание (вместо того, чтобы вывести его полужирным шрифтом или курсивом ), вы вводите пользователей сайта в заблуждение

Измените сплошное подчеркивание точками или пунктиром

Если хотите сохранить подчёркивание ссылок, но при этом изменить стиль по умолчанию (линия «solid « ), это можно сделать следующим образом. Вместо сплошной линии используйте точки. Для этого нужно удалить подчеркивание и заменить его свойством border-bottom :

a { text-decoration: none; border-bottom:1px dotted; }

Так как стандартное CSS text decoration underline мы удалили, будет отображаться только линия из точек:

То же самое можно сделать, чтобы получить пунктирное подчеркивание. Просто измените значение border-bottom на dashed :

a { text-decoration: none; border-bottom:1px dashed; }

Изменение цвета подчеркивания

Еще один способ обратить внимание пользователей на ссылки — изменить цвет подчеркивания. Н забудьте, что цвет text underline CSS должен соответствовать используемой цветовой схеме:. a { text-decoration: none; border-bottom:1px solid red; }

a { text-decoration: none; border-bottom:1px solid red; }

Двойное подчеркивание

Хитрость в создании двойного подчеркивания заключается в изменении ширины рамки. Если создать рамку шириной в 1 пиксель, в результате получится два подчеркивания, которые выглядят как одно:

a { text-decoration: none; border-bottom:3px double; }

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

a { border-bottom:1px double; }

Не забывайте о различных состояниях ссылок

Также можно использовать border-bottom для различных состояний ссылок. Использование псевдокласса :hover поможет улучшить опыт взаимодействия пользователей. Чтобы создать второе точечное подчеркивание, выводимое при наведении на ссылку курсора мыши, используйте следующий код и деактивацию CSS text decoration underline :

a { text-decoration: none; } a:hover { border-bottom:1px dotted; }

Перевод статьи «How to Change Link Underlines on a Webpage » был подготовлен дружной командой проекта .

Хорошо Плохо

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

За подчеркивание ссылок отвечает специальное свойство CSS text-decoration , которое может принимать следующие значения:

  • underline (подчеркивание есть);
  • none (выключить подчеркивание);

С этим читают