Вопросы с тегом 'css-shapes'

CSS-Shapes создаются с помощью Cascade Styling Sheets, чтобы сделать HTML-элементы фигурами и изображениями. Самые основные формы включают треугольники, квадраты и круги, но могут быть сделаны в более продвинутые формы, такие как сердца, восьмиугольники и звезды.
4

Управление штриховой длиной штриха и расстоянием между штрихами

Можно ли управлять длиной и расстоянием между штриховыми штрихами штриха в CSS? В этом примере ниже отображаются разные браузеры: div { border: dashed 4px #000; padding: 20px; display: inline-block; } <div>I have a dashed border!<...
05 мая '10 в 7:01
3

Форма с наклонной стороны (отзывчивая)

Я пытаюсь создать фигуру, как на изображении ниже, с наклонным краем только на одной стороне (например, на нижней стороне), в то время как другие края остаются прямыми. Я попытался использовать метод border (код приведен ниже), но размеры моей фи...
25 мая '15 в 14:58
7

Создание повторяющегося шестиугольного шаблона с помощью CSS3

Итак, мне нужно сделать повторяющийся гексагональный шаблон, используя CSS. Если нужны изображения, я могу пойти туда, но я предпочел бы просто использовать CSS, если это возможно. Вот идея того, что я пытаюсь создать: В принципе, мне просто нуж...
08 апр. '12 в 12:45
5

Круговая загрузка анимации

Я пытаюсь создать анимацию загрузки круга Apple OS X. То, что я пробовал до сих пор: .animation-wrapper { width: 200px; height: 200px; border: 1px solid black; border-radius: 50%; position: relative; overflow: hidden; filter: br...
06 июл. '15 в 13:36
10

Прозрачный текст, вырезанный из фона

Есть ли способ сделать прозрачный текст , вырезанный из фонового эффекта, как тот, который изображен на следующем изображении, с помощью CSS? Было бы грустно потерять все драгоценные SEO из-за изображений, заменяющих текст. Сначала я думал о те...
18 дек. '12 в 12:24
9

Создайте дизайн молниеотвода (например, вспышку)

Я пытаюсь воссоздать символ молнии от Flash (DC Comics) (или футболку, которую носит теория Big Bang Sheldon Cooper) в CSS. Это будет действовать как звездная рейтинговая система, вместо этого будет использоваться только система оценки молнии. О...
04 июн. '15 в 9:38
13

Как нарисовать круг в CSS?

Ну, рисовать круг с чистым CSS легко. .circle { width: 100px; height: 100px; border-radius: 100px; border: 3px solid black; background-color: green; } Как рисовать сектор? Учитывая степень X [0-360], я хочу нарисовать сектор X ...
18 янв. '14 в 14:50
8

Волнистая форма с css

Я пытаюсь воссоздать это изображение с помощью CSS: Мне бы не нужно было это повторять. Это то, что я начал, но у него есть прямая линия: #wave { position: absolute; height: 70px; width: 600px; background: #e0efe3; } <div id="wave"&...
19 июн. '13 в 22:38
9

Как сделать прямоугольное изображение круговым с CSS

Я использовал border-radius: 50% или border-radius: 999em, но проблема одна и та же: с квадратными изображениями нет проблем, но с прямоугольными изображениями я получаю овальный круг. Я также склонен обрезать часть изображения (очевидно). Есть ли с...
22 мар. '14 в 12:07
7

Как я могу создать чистые трехмерные сферы CSS?

tl;dr: Я хотел бы создать настоящую трехмерную сферу с помощью CSS, а не просто иллюзию Примечание: некоторые примеры фрагментов не отвечают. Пожалуйста, используйте полный экран. С помощью чистого CSS вы можете создавать и анимировать 3d-куб следу...
21 июл. '17 в 12:52
3

Перекрытие кругов в CSS с 1 div

Я хочу создать эту фигуру с перекрывающимися кругами в CSS: В принципе, просто сложены круги. Я осмотрелся, и все решения, которые я вижу, включают использование нескольких элементов div для этого эффекта. Однако нельзя ли это сделать с помощью о...
05 дек. '14 в 10:59
4

Наполнение анимации воды

Я пытаюсь очистить анимацию, чтобы круг выглядел как , наполняющийся водой. Я столкнулся с двумя ошибками и не смог даже решить третий: Он не соответствует действительности. Сбрасывается до пустого (черного) после того, как он заполнил * В наст...
20 апр. '15 в 3:17
13

Cut Corners с использованием CSS

Я хочу "вырезать" верхний левый угол div, например, если вы сгибали угол страницы вниз. Я хотел бы сделать это в чистом CSS, есть ли какие-нибудь методы?
06 сент. '11 в 18:56
5

Центр Треугольника в нижней части Div

Я пытаюсь иметь треугольник/стрелу внизу моего героя, но он не реагирует и не работает на мобильном телефоне очень хорошо, так как треугольник плавает вправо и больше не центрируется. Как я могу всегда удерживать треугольник в абсолютном центре в ни...
01 нояб. '13 в 0:39
6

Как сделать круг вокруг контента с помощью CSS?

Подобно этому Только с этим кодом <span>1</span>
20 февр. '12 в 9:35