css- все статьи тега ➜ страница 29


Bootstrap полноформатный ввод текста в встроенной форме

Я изо всех сил пытаюсь создать текстовое поле, которое соответствует всей ширине моего контейнер зона. <div class="row"> <div class="col-md-12"> <form class="form-inline" role="form"> <input type="text" class="form-control input-lg" id="search-church" placeholder="Your location (City, State, ZIP)"> <button type="submit" class="btn btn-lg">Search</button> </form> </div> ...

Как добавить CSS с Javascript?

Как вы добавляете правила CSS (например strong { color: red }) с помощью Javascript? ...

Установить свойство CSS в Javascript?

Я создал следующее... var menu = document.createElement('select'); Как бы я теперь установить CSS атрибуты, например width: 100px? ...

Указывает на специфичность в CSS

исследуя специфику я наткнулся на этот блог -http://www.htmldog.com/guides/cssadvanced/specificity/ в нем говорится, что специфичность-это система баллов для CSS. Это говорит нам, что элементы стоят 1 балл, классы стоят 10 баллов и идентификаторы стоят 100 баллов. Он также идет на вершине говорят, что эти точки суммируются и общая сумма является специфика селектора. например: тело = 1 очкотело .обертка = 11 очковтело .обертка #контейнер = 111 пунктов Итак, используя эти точки, безуслов ...

Есть ли способ использовать SVG в качестве контента в псевдо-элементе: до или после

Я хочу разместить некоторые изображения SVG перед некоторыми выбранными элементами. Я использую JQuery, но это не имеет значения. Я хотел бы иметь: перед элементом, чтобы быть как: #mydiv:before { content:"<svg.. code here</svg>"; display:block; width:22px; height:10px; margin:10px 5px 0 10px; } Если я делаю это, как показано выше, он просто отображает строку. Я проверил спецификации, и, похоже, есть некоторые ограничения на то, какой контент может быть. Есть ...

CSS3 непрерывный поворот анимации (так же, как загрузка солнечных часов)

Я пытаюсь скопировать индикатор активности Apple style (значок загрузки солнечных часов) с помощью анимации PNG и CSS3. У меня есть изображение, вращающееся и делающее это непрерывно, но, похоже, есть задержка после того, как анимация закончилась, прежде чем она сделает следующий поворот. @-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } #loading img { -webkit-animation-name: rotate; -webkit-an ...

Заполнение css заполнителя HTML5

Я видел этот post уже и пробовал все, что мог, чтобы изменить отступы для меня прототип, но увы, похоже он просто не хочет сотрудничать. в любом случае, вот код для CSS. (EDIT: это сгенерированный css от sass) #search { margin-top: 1px; display: inline; float: left; margin-left: 10px; margin-right: 10px; width: 220px; } #search form { position: relative; } #search input { padding: 0 10px 0 29px; color: #555555; border: none; background: url('/images/bg_searchbar.png?12 ...

Как я могу обнаружить "shift+enter" и создать новую строку в Textarea?

В настоящее время, если человек нажимает введите внутри текстовой области, форма будет представлять. Хорошо, я хочу этого. но когда они типа shift + введите, Я хочу, чтобы текстовая область перешла к следующей строке:n Как я могу сделать это в JQuery или простой JavaScript как можно проще? ...

Почему я не могу центрировать с полями: 0 авто?

у меня есть #header div, который является 100% width и в этом div у меня есть неупорядоченный список. Я подал заявление margin: 0 auto в неупорядоченный список, но он не будет центрировать его в заголовке div. может кто-нибудь сказать мне, почему? Я думал, что если я определяю ширину родительского div, то неупорядоченный список должен быть в состоянии центрироваться с margin: 0 auto. Чего мне не хватает? вот мой код: <style> * { margin: 0; padding: 0; } #header { width: ...

CSS браузеров по умолчанию для HTML-элементов

где я могу найти CSS браузера по умолчанию для HTML-элементов? многие элементы HTML поставляются с некоторыми свойствами CSS по умолчанию, которые иногда могут привести к неизвестному / нежелательному поведению. Например поля ввода отображаются по-разному в разных браузерах. Я ищу место, которое охватывает новые свойства CSS3 и новые элементы HTML5. Я видел в других (гораздо более старых) вопросах (таких как таблицы стилей CSS браузеров по умолчанию) ответы, которые предложите решение сброса C ...

должность: исправлено не работает на iPad и iPhone

Я уже некоторое время борюсь с фиксированным позиционированием в iPad. Я знаю iScroll и это не всегда, кажется, работает (даже в их демо). Я также знаю, что у Сенчи есть исправление для этого, но я не мог Ctrl + F исходный код для этого исправить. Я надеюсь, что кто-то может иметь решение. Проблема в том, что фиксированные позиционированные элементы не обновляются, когда пользователь перемещается вниз/вверх на мобильном Safari с питанием от iOS. ...

CSS: анимация против перехода

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

Bootstrap 3: pull-right только для col-lg

New to bootstrap 3.... В моем макете у меня есть: <div class="row"> <div class="col-lg-6 col-md-6">elements 1</div> <div class="col-lg-6 col-md-6"> <div class="pull-right"> elements 2 </div> </div> </div> Я хотел бы, чтобы "элементы 2" не были выровнены прямо на меньших, чем col-lg экранах. Так что эффективно иметь класс pull-right только для col-lg-6... Как я мог этого добиться? вот скрипка:http://jsf ...

Высота Css в процентах не работает [дубликат]

этот вопрос уже есть ответ здесь: процент высоты HTML 5 / CSS 4 ответы У меня есть следующий простой код: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Live Feed</title> <meta http-equiv="content-type" conten ...

Как я могу сделать width = 100% - 100px в CSS?

в CSS, как я могу сделать что-то вроде этого: width: 100% - 100px; Я думаю, это довольно просто, но это немного трудно найти примеры, показывающие, что. ...

Адаптивная карта изображений

У меня есть существующая карта изображений в адаптивном HTML-макете. Изображения масштабируются в соответствии с размером браузера, но координаты изображения, очевидно, фиксированные размеры пикселей. Какие параметры я должен изменить размер координат карты изображения? ...

Почему не может быть гибких контейнеров?

я пытался стиль a fieldset элемент display: flex и display: inline-flex. однако, это не работает: flex вели себя как block и inline-flex вели себя как inline-block. это происходит как на Firefox и Chrome, но странно это работает на IE. это баг? Я не мог найти это fieldset должно иметь какое-либо особое поведение, ни в HTML5, ни в CSS гибкий макет коробки характеристики. fieldset, div { display: flex; border: 1px solid; } <fieldset> <p>foo</p> < ...

Применить стиль только на IE

вот мой блок CSS: .actual-form table { padding: 5px 0 15px 15px; margin: 0 0 30px 0; display: block; width: 100%; background: #f9f9f9; border-top: 1px solid #d0d0d0; border-bottom: 1px solid #d0d0d0; } Я хочу только IE 7, 8 и 9, чтобы "видеть" width: 100% каков самый простой способ сделать это? ...

Textarea Auto height [дубликат]

этот вопрос уже есть ответ здесь: создание текстовой области с автоматическим изменением размера 34 ответы Я хочу сделать высоту textarea равной высоте текста в нем (и удалить полосу прокрутки) HTML <textarea id="note">SOME TEXT</textarea> CSS textarea#note { width:100%; direction:rtl; display:block; max-width:100%; line-height:1.5; padding:15px 15px 30px; ...

дисплей: встроенный против дисплея: блок

в чем основное различие между следующими CSS: display:inline и так: display:block используя их отдельно на элементе, я получаю тот же результат. ...