Лучшие css-shapes вопросы ИТ разработчиков

  • 2голосов
  • 2ответа
  • 0просмотров

Тег метки CSS3 направлен вправо и с использованием позиции или: после

Я пытаюсь построить эту форму в CSS: Но я не могу понять, как расположить треугольную форму (учитывая, что у меня есть прямоугольник для «тела» тега и треугольник для кончика), направленной вправо. Поскольку я работаю с позициями, как я могу ...

ЗаданDec 02, 2014, 10:16 AMотweb-tikiYisela
  • 20голосов
  • 4ответа
  • 0просмотров

Треугольная форма с фоновым изображением

Я работаю над проектом, который требует, чтобы два треугольника содержали фоновые изображения и были ссылками. Вот мой макет для того, как я хотел бы два треугольника. В настоящее время у меня есть только два div, которые охватывают 900x600 ...

ЗаданMay 11, 2016, 9:50 AMотweb-tikiRyan
  • 40голосов
  • 6ответов
  • 0просмотров

Форма CSS 3: «Обратный круг» или «Вырезанный круг»

Я хочу создать фигуру, которую я бы описал как «обратный круг»: Изображение почему-то неточное, потому что черная линия должна продолжаться вдоль внешней границы элемента div. Вот демонстрация того, что у меня есть на данный ...

ЗаданJul 14, 2014, 3:00 PMотweb-tikiAlp
  • 78голосов
  • 7ответов
  • 0просмотров

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

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

ЗаданDec 04, 2018, 8:33 PMотjaco0646element119
  • 17голосов
  • 3ответа
  • 0просмотров

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

Я хочу сделать круговой сектор с помощью CSS. Секторы образуют полный круг. Как я могу сделать это с помощью CSS? Я нашелобразец [http://jsfiddle.net/nchtG/], но это делает четверть круговой сектор. Я хочу сделать шесть круговых секторов, ...

ЗаданNov 25, 2015, 11:30 AMотweb-tikipalAlaa
  • 2голосов
  • 5ответов
  • 0просмотров

Как создать треугольную форму (фиксированная высота, ширина = 100%) с фоном

У меня есть графический фон, и мне нужно отобразить цветной треугольник в верхнем левом углу (независимо от разрешения). Могу ли я создать элемент в форме треугольника, используя только HTML / CSS / JS с шириной = 100% и высотой = 200 пикселей с ...

ЗаданNov 25, 2015, 11:32 AMотweb-tikipanther
  • 1голосов
  • 8ответов
  • 0просмотров

превращение изображения в CSS

У меня есть это изображение (прилагается). Я не дизайнер, но я не хочу использовать изображение в своем приложении. Я слышал, что вы можете очень близко подойти к изображению с помощью CSS. Может кто-нибудь помочь мне с этим изображением и ...

ЗаданMar 26, 2015, 9:28 AMотjbutler483Autolycus
  • 9голосов
  • 6ответов
  • 0просмотров

Div с вырезанными краями, окантовкой и прозрачным фоном

Я пытался выяснить, как создать пользовательскую фигуру в CSS, которая визуально будет выглядеть следующим образом: С собственностьюbackground:rgba(44, 44, 48, 0.9) а такжеborder:6px solid rgba(29, 30, 35, 0.9); Моя проблема в том, что я не ...

ЗаданJul 16, 2014, 6:20 PMотweb-tikideathlock
  • 13голосов
  • 3ответа
  • 0просмотров

CSS Zigzag Border с текстурированным фоном

Я работал над заголовком с зигзагообразной каймой. Один из способов сделать это - использовать изображения для создания эффекта зигзага. (1) Is there any way to create a practical cross-browser zigzag border in CSS without the use of images? Я ...

ЗаданMar 11, 2018, 7:06 AMотVadim Ovchinnikovambiguousmouse
  • 8голосов
  • 6ответов
  • 0просмотров

Как создать треугольник в CSS3, используя border-radius

Я использую свойство border-radius для получения закругленных углов. Но я не уверен, как получить закругленные углы этой формы. Я пытался дать одинаковые размеры с обеих сторон, но они просто не дают мне точную форму. Я пропустил некоторые ...

ЗаданJan 13, 2015, 10:33 AMотweb-tikiMike
  • 14голосов
  • 4ответа
  • 0просмотров

Как я могу сделать div с неправильной формы с CSS3 и HTML5?

Мне интересно, есть ли возможность создать div с неправильной формой, что-то похожее на это (например, Гренландия, Европа, Африка). Я хочу создать карту, как здесь с использованием CSS3 и HTML5. Вот ссылка на пример изображения:

ЗаданJan 18, 2017, 4:53 PMотTylerHRafath
  • 5голосов
  • 2ответа
  • 0просмотров

Сделай div с нижним треугольником

Я пытался сделатьwhite shapeс div: http://sircat.net/joomla/sircat/mies/2.png [http://sircat.net/joomla/sircat/mies/2.png] Как я могу получить диагональные формы нижней части div? У меня есть это для div: ширина: 620 пикселей; высота: 440 ...

ЗаданMar 01, 2015, 5:05 AMотuser1118321codek
  • 9голосов
  • 2ответа
  • 0просмотров

CSS градиент для треугольной формы стрелки

Пожалуйста, посмотрите наhttp://jsfiddle.net/ghAgQ/ [http://jsfiddle.net/ghAgQ/] Мне нужен такой же градиент для стрелки, как и для прямоугольника. Есть идеи, как это сделать? Спасибо .rectangle { background-color: #EEE; height: 80px; width: ...

ЗаданFeb 13, 2015, 9:54 AMотweb-tikiMandar
  • 5голос
  • 1ответ
  • 0просмотров

Проблемы с сайтом, ориентированные на CSS

Я получил дерзкий проект и хотел бы получить совет. Я хочу иметь сайт, который использует CSS Diamonds, я прикрепил изображение, чтобы дать лучшее представление о том, на что я смотрю. Вот проблемы, с которыми я столкнулся до сих пор: * The ...

ЗаданMay 06, 2015, 9:49 AMотJames Donnellymichaellindahl
  • 5голосов
  • 2ответа
  • 0просмотров

Сделай div с нижним треугольником

Я пытался сделатьбелая формас div: http://sircat.net/joomla/sircat/mies/2.png [http://sircat.net/joomla/sircat/mies/2.png] Как я могу получить диагональные формы нижней части div? У меня есть это для div: width: 620px; высота: 440 пикселей; ...

ЗаданSep 03, 2012, 2:07 PMотcodek
  • 9голосов
  • 2ответа
  • 0просмотров

CSS градиент для треугольной формы стрелки

Пожалуйста, посмотрите наhttp://jsfiddle.net/ghAgQ/ [http://jsfiddle.net/ghAgQ/] Мне нужен такой же градиент для стрелки, как и для прямоугольника. Есть идеи, как это сделать? спасибо .rectangle { background-color: #EEE; height: 80px; width: ...

ЗаданSep 14, 2012, 6:32 PMотMandar
  • 5голос
  • 1ответ
  • 0просмотров

Проблемы с сайтом, ориентированные на CSS

Мы получили дерзкий проект и хотели бы получить совет. Я хочу иметь сайт, который использует CSS Diamonds, яЯ приложил изображение, чтобы лучше понять, на что я смотрю. Вот проблемы, с которыми я столкнулся до сих пор: * Треугольники идеально ...

ЗаданSep 29, 2012, 5:53 AMотmichaellindahl
  • 11голосов
  • 5ответов
  • 0просмотров

Как придать div овальную форму?

Я много пробовал на овальной форме, которая разрезалась в обе стороны, но не смог сделать это, пожалуйста Мне нужен код для овальной формы с вырезом в обе стороны .. Вот'мой код ниже: - .demo{ width: 100%; height: 600px; background: white; ...

ЗаданOct 19, 2012, 8:17 AMотAnudeep
  • 6голосов
  • 4ответа
  • 0просмотров

Как использовать перекос только в родительском элементе?

Есть ли способ использовать перекос только в родительском элементе? Мне нужно создать что-то вродеалмаз» как маска и дочерние элементы могутне может быть затронут. В этом случае невозможно использовать png в качестве маски. Заранее спасибо!

ЗаданOct 23, 2012, 7:29 AMотTúlio Ribeiro
  • 14голос
  • 1ответ
  • 0просмотров

Наклоните верхнюю часть div, используя CSS без перекоса текста

Я пытаюсь создать div, который наклоняется только сверху и не искажает текст внутри него, используя CSS. Причина, по которой я хотел бы, чтобы он был только для CSS, заключается в том, что он является адаптивным дизайном и должен реагировать на ...

ЗаданNov 27, 2012, 6:27 PMотcodeadventurer
  • 24голосов
  • 3ответа
  • 0просмотров

Сегменты в круге с использованием CSS3

Я знаю, что вы можете сделать круг в CSS3, используя хак с радиусом границы. Но есть ли способ заставить их иметь сегменты, подобные этой картинке? Есть ли способ сделать это через HTML и CSS, но не JS?

ЗаданJan 06, 2013, 4:03 PMотGames Brainiac
  • 90голосов
  • 4ответа
  • 0просмотров

CSS Progress Circle [закрыто]

Я искал этот сайт, чтобы найти индикаторы выполнения, но те, которые мне удалось найти, показывают анимированные круги, которые достигают 100%. Я хотел бы остановиться на определенных процентах, как на скриншоте ниже. Есть ли способ сделать это, ...

ЗаданJan 08, 2013, 6:00 PMотAdam GunShy Said
  • 32голосов
  • 5ответов
  • 0просмотров

Как сделать 3-угольник в CSS

Мне бы хотелось получить индивидуально подобранные формы, не используя Javascript: В настоящее время я 'наложив изображениеРамка' над оранжевым прямоугольным делом, но это довольно забавно. Я полагаю, что мог бы использовать ...

ЗаданJan 21, 2013, 7:29 PMотMurray Smith
  • 5голосов
  • 2ответа
  • 0просмотров

CSS (3) и HTML Cut edge

Об этом уже спрашивали, но мне это нужно по-другому. Пожалуйста, взгляните на изображение ниже, чтобы увидеть панель навигации, которую я пытаюсь понять: Проблемы: * Тень по краям * Текст / Изображения внутри бара * 1px сплошная граница ...

ЗаданMar 04, 2013, 1:13 AMотbluewhile
  • 6голосов
  • 3ответа
  • 0просмотров

Создание треугольника в CSS с градиентным фоном

Я пытаюсь создать треугольник в CSS с градиентным фоном. У меня пока не было никакого успеха. Есть ли способ сделать это, чтобы снять этот эффект видно на рисунке ниже. (Треугольник, который прикреплен к ошибочному паролю.) Дизайн в ...

ЗаданMar 15, 2013, 3:15 PMотJoel Dean
  • 6голосов
  • 2ответа
  • 0просмотров

Создать стрелку с помощью CSS [дубликата]

На этот вопрос уже есть ответ здесь: * Граница с прозрачной центрированной стрелкой [/questions/27462276/border-with-a-transparent-centred-arrow]3 ответа Я пытаюсь создать прямую горизонтальную линию с разбивкой по центру, чтобы отобразить ...

ЗаданApr 02, 2013, 9:51 PMотIsmael Ghalimi
  • 11голосов
  • 7ответов
  • 0просмотров

Создать треугольник с помощью CSS?

Как я могу создать следующую форму с помощью CSS? Я попытался это, чтобы быть решением: .triangle:after { position:absolute; content:""; width: 0; height: 0; margin-top:1px; margin-left:2px; border-left: 10px solid transparent; border-right: ...

ЗаданApr 26, 2013, 5:42 AMотManoz
  • 205голосов
  • 5ответов
  • 0просмотров

Как этот CSS создает круг?

Это CSS: div { width: 0; height: 0; border: 180px solid red; border-radius: 180px; }Как получается круг ниже? Предположим, что если ширина прямоугольника равна 180 пикселям, а высота равна 180 пикселям, то это будет выглядеть так: После ...

ЗаданApr 24, 2013, 8:08 AMотNavin Rauniyar
  • 5голосов
  • 2ответа
  • 0просмотров

CSS применяет границу к форме облака?

Я нарисовал облако через CSS3, используя разныеdiv теги Я пытаюсь добавить границу ко всей фигуре, но у меня возникают проблемы, поскольку каждая фигура получает свою границу, как я могу применить границу ко всему облаку? HTML: CSS: * { ...

ЗаданMay 12, 2013, 1:18 PMотJeeG
  • 8голосов
  • 2ответа
  • 0просмотров

Создание прозрачной стрелки над изображением в CSS3

Я пытаюсь создать эффект, где у меня есть прозрачная стрелка над любым изображением в CSS3. Смотрите следующее изображение. Есть идеи, как сделать этот эффект? Использование LESS, если это поможет.

ЗаданMay 14, 2013, 8:01 AMотViktor Sarström
  • 116голосов
  • 15ответов
  • 0просмотров

CSS: как нарисовать круг с текстом в середине?

Я нашел этот пример на stackoverflow: Нарисуйте круг, используя только CSS [https://stackoverflow.com/questions/6936972/draw-circle-using-css-alone] Что здорово. Но я'Хотите узнать, как изменить этот пример, чтобы я мог включить текст в ...

ЗаданMay 17, 2013, 4:11 PMотdot
  • 45голосов
  • 5ответов
  • 0просмотров

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

Я пытаюсь воссоздать это изображение с помощью CSS: Мне бы не нужно было это повторять. Это то, что я начал, но у него есть прямая линия: #wave { position: absolute; height: 70px; width: 600px; background: #e0efe3; }

ЗаданJun 19, 2013, 8:38 PMотmr.musicman
  • 13голосов
  • 5ответов
  • 0просмотров

Создать форму креста в CSS

Это возможно, я знаю, что все следующие формы возможны в этой ссылке: http://css-tricks.com/examples/ShapesOfCSS/ [http://css-tricks.com/examples/ShapesOfCSS/] но крест тоже должен быть возможен. Когда я говорю крест, я имею в виду, как это:

ЗаданJun 28, 2013, 5:48 AMотuser1937021
  • 0голосов
  • 6ответов
  • 0просмотров

Выравнивание полей css arrow

Мой вопрос похож на этот вопрос:Стрелка с CSS [https://stackoverflow.com/questions/16180107/arrow-box-with-css]Но вместо одного ящика нужно выровнять несколько ящиков. И все же сможете увидеть стрелки на всех коробках. В этом ...

ЗаданJun 28, 2013, 11:50 AMотCasper Skovgaard
  • 12голосов
  • 2ответа
  • 0просмотров

Как создать CSS сердце? / Почему этот CSS создает форму сердца?

Мы нашли следующий CSS в одном из ответов на SO, и мне было интересно, почему он создает желаемую форму сердца: #heart { position: relative; width: 100px; height: 90px; } #heart:before, #heart:after { position: absolute; content: ""; left: 50px; ...

ЗаданJun 29, 2013, 11:13 PMотJunkster
  • 5голосов
  • 2ответа
  • 0просмотров

CSS-круг с двумя границами разных цветов или, по крайней мере, выглядит как [дубликат]

На этот вопрос уже есть ответ здесь: * Круг с двумя границами [/questions/20305594/circle-with-two-borders]4 ответа У меня есть круг с одной границей, но я хотел бы знать, есть ли в любом случае, чтобы получить круг с двумя границами разных ...

ЗаданJul 09, 2013, 10:46 PMотpremsh
  • 57голосов
  • 5ответов
  • 0просмотров

Как наклонить элемент, но сохранить текст в нормальном состоянии (без перекоса)

Можно ли воспроизвести это изображение, используя только CSS? Я хочу применить это к моему меню, поэтому коричневый фон появляется наhover пример Я нене знаю, как это сделать, я только знаю; .menu li a:hover{ display:block; ...

ЗаданJul 30, 2013, 10:51 AMотPreston
  • 26голосов
  • 3ответа
  • 0просмотров

Как создать форму треугольника в верхнем правом углу другого элемента div, чтобы он выглядел разделенным границей

Я хочу создать форму, как на этой картинке: Я создал треугольную форму, как на этом рисунке, и установил поля в верхнем правом углу, но я не знаю, как сделать так, чтобы он выглядел отделенным от левого элемента, как показано на ...

ЗаданAug 30, 2013, 9:36 AMотIan J
  • 44голосов
  • 4ответа
  • 0просмотров

Форма капсулы с использованием границы-радиуса без заданной ширины или высоты?

Можно ли сделать форму капсулы с использованием границы-радиуса без заданной ширины или высоты? Я хочу, чтобы левая и правая стороны были полностью закруглены, а капсула оставалась бы прямой вдоль нее ».s горизонтальная длина. Установка радиуса ...

ЗаданSep 13, 2013, 6:45 PMотchristian
  • 6голосов
  • 5ответов
  • 0просмотров

CSS овальная форма, вырезанная из div

Выше изображение то, что яЯ пытаюсь создать, но испытываю трудности с овальной формой. Объяснение: * Панель меню представляет собой div с небольшим линейным градиентом (от темно-серого до прозрачного светло-серого) * Изображение логотипа ...

ЗаданSep 16, 2013, 12:45 PMотJaz Parkyn
  • 20голосов
  • 2ответа
  • 0просмотров

Перекошенные границы на Div

Я пытаюсь исказить div, похожий на это:Наклоните верхнюю часть div, используя CSS без перекоса текста [https://stackoverflow.com/questions/13591584/slant-the-top-of-a-div-using-css-without-skewing-text] или ...

ЗаданOct 02, 2013, 7:35 PMотMichelle
Пред123След