Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.85/54: Рейтинг темы: голосов - 54, средняя оценка - 4.85
39 / 46 / 3
Регистрация: 04.06.2013
Сообщений: 1,532
1

Стрелка на css

16.08.2013, 17:35. Показов 10220. Ответов 5
Метки нет (Все метки)

Доброго времени суток.
Нашел онлайн генератор блока со стрелкой. http://cssarrowplease.com/
Дает такой код
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
26
27
28
29
.arrow_box {
    position: relative;
    background: #88b7d5;
    border: 4px solid #c2e1f5;
}
.arrow_box:after, .arrow_box:before {
    bottom: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
 
.arrow_box:after {
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #88b7d5;
    border-width: 30px;
    left: 50%;
    margin-left: -30px;
}
.arrow_box:before {
    border-color: rgba(194, 225, 245, 0);
    border-bottom-color: #c2e1f5;
    border-width: 36px;
    left: 50%;
    margin-left: -36px;
}
Что здесь отвечает за стрелку и как сделать блок с некой прозрачностью прозрачностью?
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
16.08.2013, 17:35
Ответы с готовыми решениями:

Стрелка средствами CSS
Здравствуйте. Подскажите, как сделать подобную стрелку средствами CSS (Я так понимаю, через before...

Какова вероятность, что у стрелка А попаданий будет на одно больше, чем у стрелка Б?
Доброго времени суток всем! Есть задача: "Стрелки А и Б попадают каждый в свою мишень с...

Написание простого скрипта (Стрелка влево\стрелка вправо)
Если кому-нибудь это не сложно, написать скрипт, который в активном окне нажимает поочередно...

Три стрелка стреляют по цели.Вероятность попадания в цель для первого стрелка равна 0,7,для второго - 0,8,для третьего - 0,9
Три стрелка стреляют по цели.Вероятность попадания в цель для первого стрелка равна 0,7,для второго...

__________________
5
5 / 5 / 0
Регистрация: 21.01.2013
Сообщений: 45
17.08.2013, 01:50 2
думаю что вот это

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
.arrow_box:after {
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #88b7d5;
    border-width: 30px;
    left: 50%;
    margin-left: -30px;
}
.arrow_box:before {
    border-color: rgba(194, 225, 245, 0);
    border-bottom-color: #c2e1f5;
    border-width: 36px;
    left: 50%;
    margin-left: -36px;
}
0
39 / 46 / 3
Регистрация: 04.06.2013
Сообщений: 1,532
17.08.2013, 01:54  [ТС] 3
Цитата Сообщение от Elmanderrr Посмотреть сообщение
думаю что вот это
Конкретней?
0
5 / 5 / 0
Регистрация: 21.01.2013
Сообщений: 45
17.08.2013, 01:59 4
http://jsfiddle.net/V9snd/
Вот, конкретно - border-width
2
39 / 46 / 3
Регистрация: 04.06.2013
Сообщений: 1,532
17.08.2013, 02:03  [ТС] 5
Elmanderrr,
0
0 / 0 / 0
Регистрация: 14.07.2016
Сообщений: 30
14.07.2016, 16:35 6
opacity:0.70; - значения можно менять, чем ниже - тем больше прозрачность
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
14.07.2016, 16:35

Заказываю контрольные, курсовые, дипломные работы и диссертации здесь.

Нажимая "стрелка влево", "стрелка вправо" превращать строку в столбец по или против часовой стрелке
Вывести на экран строку из 10 любых символов. Нажимая "стрелка влево", "стрелка вправо" превращать...

На экране изобразить стрелу и шар. Организовать управление стрелой, для попадания в шар знаками "стрелка влево", "стрелка вправо"
На экране изобразить стрелу и шар. Организовать управление стрелой, для попадания в шар знаками...

Перехват клавиш "стрелка влево" и "стрелка вправо"
Подскажите, как перехватывать клавишу СТРЕЛКА ВЛЕВО и ВПРАВО. Не разбираюсь в KeyPress, смог...

Стрелка
Как нарисовать стрелку точно такую же как на клаве VK_LEFT и отключить клавиши VK_UP И VK_DOWN


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

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.