Запитання з тегом «css-shapes»

На цей питання є відповіді на Stack Overflow на російському : Як створити треугольники CSS? У CSS Tricks є багато різних форм CSS - Фігури CSS, і я особливо спантеличений трикутником: #triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } …

1846 css  geometry  polygon  css-shapes 

Як створити меню, яке виглядає приблизно так ... Посилання на PSD Я не хочу використовувати зображення PSD. Я вважаю за краще використовувати піктограми з якогось пакета, наприклад FontAwesome, а фони / css генеруються у CSS. Можна знайти версію меню, яке використовує PSD для створення зображень підказки, а потім їх використання …

321 css  tooltip  css-shapes 

Я хотів би оточити число в колі, як на цьому зображенні: Чи можливо це і як це досягається?

250 html  css  css-shapes 

Я хочу мати веб-сторінку з одним центрованим словом. Я хочу, щоб це слово було намальовано анімацією, щоб сторінка "записувала" слово так само, як і ми, тобто воно починається в один момент і малює лінії та криві з часом, так що кінцевим результатом є гліф. Мені все одно, чи це робиться …

229 javascript  css  canvas  html5-canvas  css-shapes 

Як створити подібну форму для відображення на веб-сторінці? Я не хочу використовувати зображення, оскільки вони будуть розмитими під час масштабування Я спробував із CSS : .tear { display: inline-block; transform: rotate(-30deg); border: 5px solid green; width: 50px; height: 100px; border-top-left-radius: 50%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; } <div class="tear"> </div> Виконати …

222 html  css  svg  css-shapes 

Це CSS: div { width: 0; height: 0; border: 180px solid red; border-radius: 180px; } Як воно виробляє коло нижче? Припустимо, якщо ширина прямокутника становить 180 пікселів, а висота - 180 пікселів, то це буде виглядати так: Після застосування радіусу кордону в 30 пікселів це буде виглядати так: Прямокутник стає …

206 html  css  css-shapes 

Мені цікаво, чи існує простіший спосіб створити кругові дзьоби, ніж те, що я зараз роблю. Наразі я просто створюю зображення для кожного різного розміру, але це прикро це робити. Чи є все-таки за допомогою CSS для створення divs, які кругові, і я можу вказати радіус?

183 html  css  geometry  css-shapes 

Я знайшов цей приклад у stackoverflow: Намалюйте коло за допомогою css поодинці Що чудово. Але я хотів би знати, як змінити цей приклад, щоб я міг включити текст у середині кола? Я також виявив це: текст вертикального та горизонтального центрування по колу в CSS (наприклад, значок повідомлення iPhone) але чомусь …

156 css  css-shapes 

Чи можна контролювати довжину та відстань між штриховими штрихами в CSS? Цей приклад нижче відображається по-різному між браузерами: div { border: dashed 4px #000; padding: 20px; display: inline-block; } <div>I have a dashed border!</div> Виконати фрагмент кодуHide resultsРозгорніть фрагмент Великі відмінності: IE 11 / Firefox / Chrome Чи існують методи, …

124 css  border  css-shapes 

Якщо я використовую значення пікселя або em для радіуса кордону, радіус краю завжди є круговою дугою або формою таблетки, навіть якщо значення перевищує найбільшу сторону елемента. Коли я використовую відсотки , радіус краю є еліптичним і починається посередині кожної сторони елемента, що призводить до овальної або еліпсисної форми : Значення …

124 css  css-shapes 

Як намалювати коло за допомогою HTML5 та CSS3? Чи можна також помістити текст всередину?

117 html  css  geometry  css-shapes 

Спроба використовувати нетиповий колір для мого css трикутника (межі). Однак, оскільки він використовує властивості кордону, я не знаю, як це зробити. Мені хотілося б уникати JavaScript та css3 просто через сумісність. Я намагаюся, щоб у трикутника було біле тло з рамкою 1px (навколо кутових сторін трикутника) з кольором # CAD5E0. …

114 css  border  css-shapes 

Зачинено. Це питання не відповідає вказівкам щодо переповнення стека . Наразі відповіді не приймаються. Хочете вдосконалити це питання? Оновіть питання, щоб воно було тематичним для переповнення стека. Закрито 5 років тому . Удосконаліть це питання Я шукав цей веб-сайт, щоб знайти панелі прогресу, але ті, які мені вдалося знайти, показують …

112 html  css  progress-bar  progress  css-shapes 

Гаразд, так що всі знають, що ви можете зробити трикутник за допомогою цього: #triangle { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } І це дає суцільний, заповнений трикутником. Але як би ви зробили такий трикутник, який нагадує стрілу, подібний до …

102 html  css  css-shapes 

На цей питання є відповіді на Stack Overflow на російській мові : Прозрачний текст вирезан з фони Чи є спосіб зробити прозорий текст, вирізаний із фонового ефекту, такого як на наступному зображенні, за допомогою CSS? Було б сумно втратити всі цінні SEO, оскільки зображення замінюють текст. Спочатку я подумав про …

92 css  svg  fonts  css-shapes