CSS-формы создаются с использованием каскадных таблиц стилей для преобразования HTML-элементов в формы и изображения. Самые простые формы включают треугольники, квадраты и круги, но могут быть преобразованы в более сложные формы, такие как сердца, восьмиугольники и звезды.
На этот вопрос есть ответы на Переполнение стека на русском : Как создать треугольники CSS? В CSS Tricks есть множество различных форм CSS - Формы CSS, и я особенно озадачен треугольником: #triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid...
Как мне создать меню, которое выглядит следующим образом ... Ссылка на PSD Я не хочу использовать PSD изображения. Я бы предпочел использовать иконки из какого-то пакета, такого как FontAwesome, и иметь фоны / CSS, созданные в CSS. Версия меню, в которой используется PSD для создания изображений...
Я хотел бы окружить число в круг, как на этом изображении: Возможно ли это и как это
Я хочу иметь веб-страницу с одним центрированным словом. Я хочу, чтобы это слово было нарисовано с помощью анимации, чтобы страница «записывала» слово так же, как и мы, то есть оно начинается в одной точке и рисует линии и кривые с течением времени, так что конечным результатом является глиф. Мне...
Как мне создать такую фигуру для отображения на веб-странице? Я не хочу использовать изображения, так как они будут размыты при масштабировании Я попробовал с CSS : .tear { display: inline-block; transform: rotate(-30deg); border: 5px solid green; width: 50px; height: 100px;...
Это CSS: div { width: 0; height: 0; border: 180px solid red; border-radius: 180px; } Как получается круг ниже? Предположим, что если ширина прямоугольника равна 180 пикселям, а высота равна 180 пикселям, то это будет выглядеть так: После применения border-radius 30 пикселей это будет выглядеть так:...
Мне интересно, есть ли более простой способ создания круговых элементов, чем то, что я делаю сейчас. В настоящее время я просто делаю изображения для каждого размера, но это раздражает. Есть ли в любом случае использование CSS для создания div, которые являются круглыми, и я могу указать...
Я нашел этот пример на stackoverflow: Нарисуйте круг, используя только CSS Что здорово. Но я хотел бы знать, как изменить этот пример, чтобы я мог включить текст в середине круга? Я также нашел это: вертикально и горизонтально центрируя текст по кругу в CSS (например, значок уведомления iphone) но...
Если я использую значение в пикселях или em для border-radius, радиус края всегда представляет собой дугу окружности или форму таблетки, даже если значение больше, чем наибольшая сторона элемента. Когда я использую проценты , радиус края является эллиптическим и начинается в середине каждой стороны...
Можно ли в CSS контролировать длину и расстояние между штрихами пунктирной границы? Этот пример ниже отображается по-разному в разных браузерах: div { border: dashed 4px #000; padding: 20px; display: inline-block; } <div>I have a dashed border!</div> Запустить фрагмент кодаСкрыть...
Как нарисовать круг с помощью HTML5 и CSS3? Можно ли также поместить внутрь
Попытка использовать собственный шестнадцатеричный цвет для моего треугольника (границы) css. Однако, поскольку он использует свойства границы, я не уверен, как это сделать. Я хотел бы держаться подальше от javascript и css3 просто из-за совместимости. Я пытаюсь сделать треугольник белым фоном с...
Закрыто. Этот вопрос не соответствует рекомендациям по переполнению стека . В настоящее время он не принимает ответы. Хотите улучшить этот вопрос? Обновите вопрос, чтобы он соответствовал теме Stack Overflow. Закрыт 5 лет назад . Уточните этот вопрос Я искал этот веб-сайт, чтобы найти индикаторы...
Итак, все знают, что можно сделать треугольник, используя это: #triangle { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } И это дает сплошной закрашенный треугольник. Но как сделать такой треугольник в виде полой...
Я пытаюсь создать форму, как на изображении ниже, со скошенным краем только с одной стороны (например, с нижней стороны), в то время как другие края остаются прямыми. Я пробовал использовать метод границы (код приведен ниже), но размеры моей формы динамические, поэтому я не могу использовать этот...
На этот вопрос есть ответы на Stack Overflow на русском : Прозрачный текст вырезан из фонарей Есть ли способ вырезать прозрачный текст из фонового эффекта, такого как на следующем изображении, с помощью CSS? Было бы грустно потерять все драгоценное SEO из-за того, что изображения заменяют текст....
Я только что наткнулся на изящный трюк с CSS. Посмотри на скрипку ... .tooltiptail { display: block; border-color: #ffffff #a0c7ff #ffffff #ffffff; border-style: solid; border-width: 20px; width: 0px; height: 0px; } .anothertail { background-image:...
Я пытаюсь воссоздать это изображение с помощью CSS: Мне не нужно было бы это повторять. Это то, что я начал, но у него просто прямая линия: #wave { position: absolute; height: 70px; width: 600px; background: #e0efe3; } <div id="wave"></div> Запустить фрагмент кодаСкрыть...
Итак, мне нужно сделать повторяющийся шестиугольный узор с помощью CSS. Если нужны изображения, я могу пойти туда, но я бы предпочел просто использовать CSS, если это возможно. Вот идея того, что я пытаюсь создать: По сути, мне просто нужен способ создать шестиугольные формы, а затем наложить на...