Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.71/7: Рейтинг темы: голосов - 7, средняя оценка - 4.71
0 / 0 / 0
Регистрация: 31.03.2016
Сообщений: 36

Стилизовать ссылку

15.02.2017, 20:44. Показов 1396. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Добрый вечер,возникла проблема с стилизацией ссылки, не могу понять как можно сделать стрелочку с помощью css.В общем, нужно сделать вот такую стрелочку:

Есть у кого нибудь какие то предложения?)))
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
15.02.2017, 20:44
Ответы с готовыми решениями:

Стилизовать текст
Здравствуйте, дорогие коллеги! Есть задание от дизайнера, которое меня немного ввело в ступор. Не хочу говнокодить картинкой. может есть...

стилизовать range
Подскажите как вообще можно стилизовать range. Желательно кроссбраузерность.

Стилизовать select
Привет, ребят! Подскажите как я могу стилизовать выпадающий список у select на css? Мне нужно убрать рамку у выпадающего списка,...

4
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
15.02.2017, 21:03
Лучший ответ Сообщение было отмечено Fedor92 как решение

Решение

d3v1ldream, примерно так:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        a{
            display: inline-block;
            position:relative;
            width:100px;
            height: 50px;
            background: red;
            text-decoration: none;
            text-align: center;
            font:14px/50px Tahoma;
            color:#fff;
            border-radius:5px 0 0 5px 
        }
        a:after{
            content:"";
            position:absolute;
            right:-40px;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 25px 0 25px 40px;
            border-color: transparent transparent transparent red;
        }
    </style>
</head>
<body>
<a href="#">15000 р.</a>
</body>
</html>
1
202 / 138 / 88
Регистрация: 21.12.2014
Сообщений: 369
15.02.2017, 21:05
https://jsfiddle.net/j11q4yr8/
HTML5
1
<div class="price">15500 Р.</div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
* {
  box-sizing: border-box;
}
 
.price {
  position: relative;
  display: block;
  font-size: 20px;
  color: white;
  background-color: #ee3643;
  height: 40px;
  width: 100px;
  border-radius: 2px 0 0 2px;
  padding-top: 8px;
  padding-left: 15px;
}
 
.price::after {
  content: '';
  position: absolute;
  top: 0;
  right: -40px;
  border: 20px solid transparent;   
  border-left: 20px solid #ee3643;
}
0
0 / 0 / 0
Регистрация: 31.03.2016
Сообщений: 36
15.02.2017, 21:18  [ТС]
Спасибо) У меня был похожий подход, но я забылся по after)

Добавлено через 8 минут
Цитата Сообщение от Fedor92 Посмотреть сообщение
border-color: transparent transparent transparent red;
Извини конечно) А что эта строка делает? Она задает разные цвета для границ(влнп)?
0
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
15.02.2017, 21:54
Цитата Сообщение от d3v1ldream Посмотреть сообщение
А что эта строка делает? Она задает разные цвета для границ(влнп)?
Строка из генератора треугольничков... Можно легко заменить на:
CSS
1
border-color: transparent red
transparent - устанавливает прозрачный фон.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
15.02.2017, 21:54
Помогаю со студенческими работами здесь

Стилизовать audio
Добрый день! Подскажите пожалуйста, каким образом можно стилизовать аудиоплеер. Мне нужно придать ему цвет зеленой травы...и ее...

Когда стилизовать скроллбар?
Заранее прошу прощения, если ошибся форумом, но посчитал что тут самое ему место. Разрабатываю веб-приложение. В том числе делаю верстку....

Как стилизовать блоки?
Здравствуйте, Помогите с css. Самая большая проблема - вогнуть блоки внутрь Макет на картинке Заранее благодарю

Стилизовать чекбоксы и радиокнопки
Здравствуйте, подскажите как на css (не хочется для этого использовать js) стилизовать радиокнопки и чекбоксы. Спасибо.

Как стилизовать виджет погоды
Как сделать такой виджет погоды?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
1С: Контроль уникальности заводского номера
Maks 23.03.2026
Алгоритм контроля уникальности заводского (или серийного) номера на примере документа выдачи шин для спецтехники с табличной частью. Данные берутся из регистра сведений, по которому настроено. . .
Хочу заставить корпорации вкладываться в здоровье сотрудников: делаю мат модель здравосохранения
anaschu 22.03.2026
e7EYtONaj8Y Z4Tv2zpXVVo https:/ / github. com/ shumilovas/ med2. git
1С: Программный отбор элементов справочника по группе
Maks 22.03.2026
Установка программного отбора элементов справочника "Номенклатура" из модуля формы документа. В качестве фильтра для отбора справочника служит группа номенклатуры. Отбор по наименованию группы. . .
Как я обхитрил таблицу Word
Alexander-7 21.03.2026
Когда мигает курсор у внешнего края таблицы, и нам надо перейти на новую строку, а при нажатии Enter создается новый ряд таблицы с ячейками, то мы вместо нервных нажатий Энтеров мы пишем любые буквы. . .
Krabik - рыболовный бот для WoW 3.3.5a
AmbA 21.03.2026
без регистрации и смс. Это не торговля, приложение не содержит рекламы. Выполняет свою непосредственную задачу - автоматизацию рыбалки в WoW - и ничего более. Однако если админы будут против -. . .
1С: Программный отбор элементов справочника по значению перечисления
Maks 21.03.2026
Установка программного отбора элементов справочника "Сотрудники" из модуля формы документа. В качестве фильтра для отбора служит значение перечислений. / / Событие "НачалоВыбора" реквизита на форме. . .
Переходник USB-CAN-GPIO
Eddy_Em 20.03.2026
Достаточно давно на работе возникла необходимость в переходнике CAN-USB с гальваноразвязкой, оный и был разработан. Однако, все меня терзала совесть, что аж 48-ногий МК используется так тупо: просто. . .
Оттенки серого
Argus19 18.03.2026
Оттенки серого Нашёл в интернете 3 прекрасных модуля: Модуль класса открытия диалога открытия/ сохранения файла на Win32 API; Модуль класса быстрого перекодирования цветного изображения в оттенки. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru