1 Востаннє редагувалося Nick9956 (14.03.2017 20:46:16)

Тема: Обводки навколо тексту || HTML

Всім привіт

Підкажіть, хтось з таким може стикався

Як зробити товстий контур тексту , такий як на малюнку ?
Я маю на увазі контур навколо кожної буква

Читав, що це можна зробити за допомогою text-shadow, але на практиці так і не вийшло зробити

Post's attachments

Без імені.png 5.7 kb, 126 downloads since 2017-03-14 

2

Re: Обводки навколо тексту || HTML

Мабудь тобі потрібно дістати той фонт, що на малюнку.
Інакше, гадаю, ніяк.

3

Re: Обводки навколо тексту || HTML

http://htmlbook.ru/css/text-shadow - перше ж посилання з видачі Гугл. Скажіть, що саме у Вас не виходить...

4

Re: Обводки навколо тексту || HTML

misha_bondar_2012 написав:

перше ж посилання з видачі Гугл.

Йому потрібна не тінь, а жирна окантовка навколо літер.

5 Востаннє редагувалося Betterthanyou (15.03.2017 02:34:11)

Re: Обводки навколо тексту || HTML

Vi написав:
misha_bondar_2012 написав:

перше ж посилання з видачі Гугл.

Йому потрібна не тінь, а жирна окантовка навколо літер.

Я думаю це якраз за допомогою тіні і робиться, просто потрібно багато її додати.

Ось щось схоже, але потрібно шрифт ще найти більш підходящий (поки що це Arial Narrow)

CSS

.text {

    font-family: Arial Narrow;
    font-size: 51px;
    color: #FFFFFF;
    text-shadow: 
        -0   -4px 0   #0A3E53,
         0   -4px 0   #0A3E53,
        -0    4px 0   #0A3E53,
         0    4px 0   #0A3E53,
        -4px -0   0   #0A3E53,
         4px -0   0   #0A3E53,
        -4px  0   0   #0A3E53,
         4px  0   0   #0A3E53,
        -1px -4px 0   #0A3E53,
         1px -4px 0   #0A3E53,
        -1px  4px 0   #0A3E53,
         1px  4px 0   #0A3E53,
        -4px -1px 0   #0A3E53,
         4px -1px 0   #0A3E53,
        -4px  1px 0   #0A3E53,
         4px  1px 0   #0A3E53,
        -2px -4px 0   #0A3E53,
         2px -4px 0   #0A3E53,
        -2px  4px 0   #0A3E53,
         2px  4px 0   #0A3E53,
        -4px -2px 0   #0A3E53,
         4px -2px 0   #0A3E53,
        -4px  2px 0   #0A3E53,
         4px  2px 0   #0A3E53,
        -3px -4px 0   #0A3E53,
         3px -4px 0   #0A3E53,
        -3px  4px 0   #0A3E53,
         3px  4px 0   #0A3E53,
        -4px -3px 0   #0A3E53,
         4px -3px 0   #0A3E53,
        -4px  3px 0   #0A3E53,
         4px  3px 0   #0A3E53,
        -4px -4px 0   #0A3E53,
         4px -4px 0   #0A3E53,
        -4px  4px 0   #0A3E53,
         4px  4px 0   #0A3E53,
        -4px -4px 0   #0A3E53,
         4px -4px 0   #0A3E53,
        -4px  4px 0   #0A3E53,
         4px  4px 0   #0A3E53;

}

HTML

<p class="text">Обслуживание сайта</p>
Подякували: Monolith, Nick9956, Сергій78, ostap34PHP4