css- все статьи тега ➜ страница 37
Вращающийся глобус в CSS
Я создаю эффект вращающейся Земли в CSS. Я создал глобус в CSS: body { background-color: #111; } #earth { width: 300px; height: 300px; background: url(http://www.noirextreme.com/digital/Earth-Color4096.jpg); border-radius: 50%; background-size: 610px; box-shadow: inset 8px 36px 80px 36px rgb(0, 0, 0), inset -6px 0 12px 4px rgba(255, 255, 255, 0.3); animation-name: rotate; animation-duration: 12s; animation-iteration-count: infinite; ...
Центр в div
после некоторого поиска я не нашел правильного способа центрировать список <li> в фиксированную ширину div. посмотри страница.. Это тоже не работает! ...
Как лучше всего организовать правила CSS? [закрытый]
какие стратегии помогают вам отслеживать большое количество правил CSS? Как вы организуете свои файлы, блоки кода и правила? ...
iOS 7 iPad Safari Landscape innerHeight / outerHeight проблема макета
мы видим проблемы с веб-приложением, которое имеет высоту 100% на Safari в iOS 7. Оказывается, что окно.innerHeight (672px) не соответствует окну.outerHeight (692px), но только в ландшафтном режиме. В конечном итоге происходит то, что в приложении со 100% высотой на теле вы получаете 20px дополнительного пространства. Это означает, что когда пользователь пролистывает наше приложение, элементы навигации подтягиваются за браузер chrome. Это также означает, что любые абсолютно позиционированные эле ...
Как перезапустить CSS-анимацию WebKit с помощью JavaScript?
Итак, у меня есть это -webkit-animation правила: @-webkit-keyframes shake { 0% { left: 0; } 25% { left: 12px; } 50% { left: 0; } 75% { left: -12px; } 100% { left:0; } } и некоторые CSS, определяющие некоторые правила анимации на моем box: #box{ -webkit-animation-duration: .02s; -webkit-animation-iteration-count: 10; -webkit-animation-timing-function: linear; } Я могу shake the #box такой: document. ...
Как я могу проверить и настроить:до и после псевдо-элементов в браузере?
Я создал некоторые довольно сложные элементы DOM с псевдо-элементом: after, и я хотел бы иметь возможность проверять и настраивать их либо в Chrome Inspector, либо в Firebug или эквивалентном. несмотря на то, что эта функция упоминается в это сообщение в блоге WebKit/Safari (датировано 2010), я не могу найти эту функцию вообще ни в Chrome, ни в Safari. Chrome, по крайней мере, имеет флажки для проверки :hover,: visited и :active состояний, но: before и :after нигде не будет увиденный. кроме то ...
CSS: создание белого свечения вокруг изображения
Как я могу создать белое свечение в качестве границы изображения неизвестного размера? ...
Самый простой css для Facebook стиль "красные" уведомления
Мне нужно уведомление в стиле facebook, но получить что-то, что выглядит красиво кросс-браузер кажется сложным. Например, различные браузеры, по-видимому, обрабатывают прокладки по-разному, что приводит к странным уведомлениям. каков лучший кросс-браузерный способ обеспечения красивого отображения уведомлений? Не отрицательно к использованию javascript, но чистый css, конечно, предпочтительнее ...
Что делает @ -moz-document url-prefix ()?
у Саймона Коллисона новый адаптивный веб-дизайн, в CSS, есть несколько объявлений, как это: @-moz-document url-prefix() { .fl { float:left; margin:12px 4px 0 0; padding:0; font-size:65px; line-height:62%; color:#ba1820; } .fs { float:left; margin:12px 4px 10px 0; padding:0; font-size:65px; line-height:62%; color:#ba1820; } } что это на самом деле делать? Я погуглил для @ -moz-document url-prefix () и нашел ссылки для его использования в userchrome, но не стандартные таблицы стилей сайта ...
Как изменить размер переключателя с помощью CSS?
есть ли способ контролировать размер переключателя в CSS ? ...
Несколько классов внутри:не () [дубликат]
этот вопрос уже есть ответ здесь: может ли псевдокласс: not () иметь несколько аргументов? 5 ответов я пытаюсь использовать :not() свойство для исключения пары классов из правила, например: *:not(.class1, class2) { display: none; } однако, это выглядит как not() свойство не поддерживает запятая разделенные классы, как показано в эта скрипка. HTML: <div class='one'> foo </div> <div ...
Как изменить цвет отключенных html-элементов управления в IE8 с помощью css
Я пытаюсь изменить цвет входных элементов управления, когда они отключены с помощью следующего css. input[disabled='disabled']{ color: #666; } это работает в большинстве браузеров, но не IE. Я могу изменить любые другие свойства стиля, такие как цвет фона, цвет границы и т. д... только не цвет. Кто-нибудь может это объяснить? ...
CSS для отображения границы пустой ячейки?
какой CSS следует использовать для отображения границы ячейки, даже если ячейка пуста? IE 7 в частности. ...
Разделить Div на 2 столбца с помощью CSS
Я пытался разделить div на два столбца с помощью CSS, но мне еще не удалось заставить его работать. Моя основная структура выглядит следующим образом: <div id="content"> <div id="left"> <div id="object1"></div> <div id="object2"></div> </div> <div id="right"> <div id="object3"></div> <div id="object4"></div> </div> </div> если я попытаюсь переместить правый и левый дивы в их соотв ...
Как бы вы это сделали: таблицы или CSS? [закрытый]
головоломка http://sontag.ca/TheChallenge/tiles.gif Гринч http://sontag.ca/gif/grinch.gif Часть I этот макет можно сделать довольно просто с 2 таблицами HTML, одна вложенная в другую, или даже с одной таблицей. Это также может быть сделано с помощью CSS, хотя это может включать еще немного подумать. это может быть не реальный макет мира, но я видел страницы, которые похожи. Считайте это загадкой; упражнение, чтобы поднять ваши навыки CSS. чтобы сделать вещи немного интереснее, я сформулир ...
box-shadow на IE9 не отображает с помощью правильного CSS, работает на Firefox, Chrome
Я пытаюсь имитировать плавающий модальный тип коробки, но у меня проблема с IE9 и его теневой реализацией коробки. вот краткое описание кода, который я использую, который может дублировать проблему: <html> <head> <title>Sample page</title> <style> .content-holder { border-collapse: collapse; } .back { background-color: #a8c0ff; padding: 100px; } .inner { background-col ...
Пульсирующее сердце CSS анимация
Я работаю над анимированным сердцем только с CSS. Я хочу, чтобы он пульсировал 2 раза, сделайте небольшой перерыв, а затем повторите его снова. что у меня сейчас: small ==> big ==> small ==> repeat animation то, что я собираюсь: small ==> big ==> small ==> big ==> small ==> pause ==> repeat animation как я могу это сделать? мой код : #button{ width:450px; height:450px; position:relative; top:48px; margin:0 auto; text-align:center; } ...
Как я могу переопределить встроенные стили с помощью внешнего CSS?
у меня есть разметка, которая использует встроенные стили, но у меня нет доступа, чтобы изменить эту разметку. Как переопределить встроенные стили в документе, используя только CSS? Я не хочу использовать jQuery или JavaScript. HTML: <div style="font-size: 18px; color: red;"> Hello World, How Can I Change The Color To Blue? </div> CSS: div { color: blue; /* This Isn't Working */ } ...
:не (: пустой) селектор CSS не работает?
у меня чертовски много времени с этим конкретным селектором CSS, который не хочет работать, когда я добавляю :not(:empty) к нему. Кажется, он отлично работает с любой комбинацией других селекторов: input:not(:empty):not(:focus):invalid { border-color: #A22; box-shadow: none } если я удалить :not(:empty) часть, он работает просто отлично. Даже если я изменю селектор на input:not(:empty) он по-прежнему не будет выбирать поля ввода, в которые введен текст. Это сломано или я просто не могу исполь ...
Получить высоту div без набора высоты в css
есть ли способ получить высоту элемента, если нет набора правил высоты CSS для элемента, который я не могу использовать .метод height() jQuery, потому что сначала ему нужен набор правил CSS? Есть ли другой способ получить высоту? ...