Тег Span

HTMLка

Тег SPAN

Тег SPAN визуально ничего не меняет сам по себе.
Тег SPAN предоставляет возможность добавить "крючок" части текста или документа.
Когда текст помечен таким бразом с помощью элемента SPAN, Вы можете добавить стили к содержанию, или манипулировать контентом с помощью JavaScript.

---

КРАСНЫЙ ТЕКСТ ПЕРЕЧЕРКНУТ ЧЕРНОЙ ЛИНИЕЙ

<span style="color:black; text-decoration:line-through;"><span style="color:red">ВАШ ТЕКСТ</span></span>

---

СИНИЙ ТЕКСТ ПОДЧЕРКНУТ КРАСНОЙ ЛИНИЕЙ

<span style="color:red; text-decoration:underline;"><span style="color:blue">ВАШ ТЕКСТ</span></span>

---

СИНИЙ ТЕКСТ ПОДЧЕРКНУТЫЙ ДВОЙНОЙ ЛИНИЕЙ

<span style="border-bottom: double red;"><span style="color:blue">ВАШ ТЕКСТ</span></span>

---

ТЕКСТ, ПОДЧЕРКНУТЫЙ ПУНКТИРОМ

<span style="border-bottom: 2px dashed blue;">ВАШ ТЕКСТ</span>

---

ТЕКСТ В ТОЧЕЧНОЙ РАМКЕ

<span style="border: dotted red thin;"> ВАШ ТЕКСТ </span>

---

ТЕКСТ В ПУНКТИРНОЙ РАМКЕ

<span style=border-style:dashed;5px;> ВАШ ТЕКСТ </span>

---

ТЕКСТ В РАМКЕ

<span style="border: solid black 3px;">ВАШ ТЕКСТ</span>

---

КРАСНЫЙЙ ТЕКСТ В СИНЕЙ РАМКЕ

<span style="border:2px solid blue; padding:3px;"><span style="color:red;">ВАШ ТЕКСТ</span></span>

---

ТЕКСТ В ДВОЙНОЙ РАМКЕ

<span style="border-style: double; padding:3px;">ВАШ ТЕКСТ</span>

---

ЦВЕТНОЙ ТЕКСТ В ДВОЙНОЙ ЦВЕТНОЙ РАМКЕ

<span style="border-style: double; color: blue; padding:3px;"><span style="color:red;">ВАШ ТЕКСТ</span></span>

---

ТЕКСТ В ОДНОТОННОЙ 3D РАМКЕ

<span style="border: ridge #FF8000 thick;"> ВАШ ТЕКСТ </span>

---

ВАШ ТЕКСТ В ОБЬЕМНОЙ 3D-РАМКЕ

<span style="border-width:thick; border-style:groove; padding:4px; border-color:#00BFFF"> ВАШ ТЕКСТ </span>

---

ТЕКСТ В ЦВЕТНОЙ РАМКЕ 3D

<span style="border: inset #FF0000 3px;">ВАШ ТЕКСТ</span>

---

ТЕКСТ В ЦВЕТНОЙ РАМКЕ 3D

<span style="border: outset #4682B4 3px;">ВАШ ТЕКСТ</span>

---

ТЕКСТ В РАДУЖНОЙ РАМКЕ

<span style="border-style: solid; border-width: thick; border-top-color: #00FF00; border-right-color: #00FFFF; border-bottom-color: #FFFF00; border-left-color: #8080FF;"> ВАШ ТЕКСТ </span>

---

ЦВЕТНОЙ ТЕКСТ С ЦВЕТНЫМ ФОНОМ

<span style="background-color:DarkGreen;color:white; padding:3px;">ВАШ ТЕКСТ</span>

---

Цветной текст с цветным фоном в цветной рамке

<span style="background-color:SaddleBrown; color:white; padding:3px; border:3px solid Green;"> ВАШ ТЕКСТ </span>

---

НА ЗАМЕТКУтег SPAN во всех приведенных примерах можно заменять на тег DİV
Размеры блока div задаются атрибутами:
div style=width:200px; height:50px;
где width:200px; - ширина 200 пикселей,
height:50px; - высота 50 пикселей

ЗДЕСЬ ВАШ ТЕКСТ

<div style="width:150px; height:50px; border-width:thick; border-style:groove; padding:4px; border-color:#0000CD">ВАШ ТЕКСТ </div>

---

Понравился пост - добавь в закладки, чтобы не потерять:

Похожие по тематике посты - еще почитать:

.