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


Вычитание ширины CSS

Как вычесть ширину в CSS? Например: width = 100% - 10px Я не говорю о заполнении или полях. ...

Safari flex-grow поведение, отличное от Chrome / FF / Edge (css flexbox)

Я получаю различное поведение между Safari и Chrome / FF / Edge с помощью flex-grow. Я пытаюсь получить вертикальный центр, но safari дает больше фиксированного эффекта снизу. Я использую flex-grow с десятичным числом, но Safari, похоже, интерпретирует его как целое значение. HTML <div class="fc"> <div>Align Top</div> <div>Align Center</div> <div>Align Bottom</div> <div class="spacer">Bottom Spacer</div> </div> CSS .fc { ...

CSS Float on anchor tag приводит к увеличению размера элемента по сравнению с его использованием в элементе списка

При следующей настройке с использованием float на теге привязки, a, это приводит к увеличению размера навигации (по сравнению с использованием его только на li - см. ниже). Почему это так? nav { background-color: rgb(25,25,25); border: 1px solid rgba(255,255,255,.5); border-left: none; border-right: none; } nav ul { padding: 0; margin: 0; overflow: hidden; } nav li { padding: 0; margin: 0; list-style: none; } nav a { float: left; font-size: .8em; color: wh ...

Создание выпадающего меню по клику CSS

Я должен построить меню с 5 опциями, при нажатии на определенную появится новое подменю. Я совершенно не представляю, как это сделать. /**Navigation */ nav { border: 1px solid red; float: left; margin-right: 35px; min-height: 280px; } nav li { text-decoration: none; font-weight: normal; color: red; list-style: none; } /**Content */ #section { background-color: ; border: 1px solid; font: normal 12px Helvetica, Arial, sans-serif; margin-le ...

Как создать форму ценника в CSS и HTML

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

Нарисуйте кривую с помощью css

Я хочу создать анимацию с css, которая имитирует движение волны. Для этого мне нужно изменить линию-или div-на кривую... Правила CSS, с которыми я знаком, делают весь div полукруглым или изменяют границу элемента. Например: border-radius, или perspective, или border-top-radius... Это изображение покажет вам, чего я хочу.: Есть ли у вас опыт в этом? или это возможно? Заранее благодарю... ...

Активация ссылок в Javascript

У меня есть некоторые проблемы с Javascript. На самом деле, я просто новичок в этом языке сценариев, поэтому мне нужна помощь.. Вопрос: как сделать эту ссылку активной: <a href="#box1">something</a> Эта ссылка является просто ссылкой на div, который находится в индексе.html-файл, поэтому загрузка страницы отсутствует. а вот div <div id="box1" class="box"> <h3><a name="box1">something</a></h3> </div> ...

как изменить высоту строки в FullCalendar?

Это мой контроллер $calendar = Calendar::addEvents($events) ->setOptions([ //set fullcalendar options 'firstDay' => 1, 'height' => '200px', 'themeSystem' => 'bootstrap3', 'columnHeader' => false, 'aspectRatio' => 1 ]); Я изменяю высоту контейнера, но размер ячейки остается с полосой прокрутки Я хочу изменить свой календарь вот так ...

Создание динамической формы в виде стрелки с помощью CSS

Я хотел бы создать сложную стрелкообразную форму с CSS, как это изображение: Это текущий код: .camera_caption { position: relative; background-color: greenyellow; left: 0; margin-top: 263px; width: 717px; /*height: 234px;*/ padding-left: 365px; font: normal 14px/24px 'Roboto'; color: #fff; } .camera_caption:after { content: ""; background: url(../images/capture_bg2.png) 0 0 no-repeat; position: absolute; height: 234px; width: 119px; ...

Как запустить svg анимацию с помощью Javascript? (Нет Jquery)

У меня есть путь линии svg, анимированный с этим образцом, который я нашел: svg{ position:absolute; width:100%; height:100%; left:0%; top:0%; display:block; background:transparent; } .path { stroke:black; stroke-dasharray: 290; stroke-dashoffset: 130; a ...

Запретить прокрутку родительского контейнера при прокрутке в переполнении: контейнер прокрутки достиг своих пределов

Проще говоря, я думаю, что вы все знаете эту проблему: вы используете колесо мыши (или жест трекпада) для прокрутки внутри div, которое установлено в overflow:scroll (или параметр для этого эффекта). Как только вы достигнете конца области прокрутки, команды прокрутки немедленно отправляются в родительский контейнер - например, в Главное окно. Это может быть довольно раздражающим, и я задаюсь вопросом, есть ли способ предотвратить это. Я создал этот jsFiddle , чтобы продемонстрировать проблему ...

Почему google font weight не работает?

Я пытаюсь изменить h1 на font-weight: 300. За исключением тех случаев, когда я это делал: .h1{ font-weight: 300; } Ничего не случилось! Таким образом, чтобы проверить вес шрифта на других текстовых элементах, я установил весь инкапсулирующий контейнер, container-fluid, в font-weight: 200: .container-fluid{ font-family: 'Work Sans', sans-serif; font-weight: 200; } ...И только пара элементов изменила их font-weight (см. здесь: JFiddle). Остальные остались прежними. Почему это ...

Поддерживает ли IE9 3D CSS преобразования?

Кто-нибудь запускал тесты для запуска 3D CSS-преобразований в Internet Explorer 9? Если да, то были ли они успешными? Я не могу найти никакой информации о нем, конечно Chrome / Safari / Firefox уже добавляют поддержку для него:) какой-то новый злой 3D CSS синтаксис Translate3d(x, y, z), translateZ (z) Переместите элемент в x, y и z, и просто переместите элемент в z. положительный z направлен к зрителю. В отличие от x и y, значение z не может быть процент. Scale3d(sx, sy, sz), scaleZ ( ...

Положение курсора по центру и в середине для javaFX TextArea

Я хочу, чтобы мой курсор текстовой области JavaFX был горизонтально и вертикально центрирован. Я уже пробовал использовать CSS с такими атрибутами, как -fx-text-alignment: center; Или -fx-text-origin: bottom; Но это не сработало :-(. Может ли кто-нибудь сказать мне, если и возможно, как это работает? ...

Каков предпочтительный способ выполнения CSS-ролловера?

При настройке эффекта ролловера в HTML, есть ли какие-либо преимущества (или подводные камни), чтобы сделать это в CSS против JavaScript? Есть ли какие-либо проблемы с производительностью или ремонтопригодностью кода, о которых я должен знать при любом подходе? ...

Textarea и input имеют разную ширину

CSS: textarea, input { width:300px; } HTML: <textarea id="input"></textarea> <br> <input type="submit"> Live Demo: http://codepen.io/qaz/pen/teaiG Почему входные и текстовые области отображаются с разной шириной? Какие свойства мне нужно добавить, чтобы сделать их одинаковой ширины? Обновление: Установив границы и отступы в 0px, я могу сделать их отображение одинаковой ширины. Никто не хочет набивки: 0px, хотя, как ни странно, когда набивка составляет, скаже ...

Как изменить индикаторы и элементы управления bootstrap carousel

Я застрял, пытаясь изменить расположение индикаторов и элементов управления bootstrap carousel. Похоже на что-то вроде этой карусели на этом сайте. http://www.mitre10.co.nz / были индикаторы и элементы управления находятся внизу и вдали от изображения. Вот мой живой вид http://codepen.io/riwakawebsitedesigns/pen/qdiup <header id="masterhead"> <div class="container"> <div class="slideshow"> <div id="slideshow" class="carousel slide" data-ride="carousel"> ...

существует ли ограничение на размер файла css?

Я использую ASP.NET MVC для разработки сайта. CSS-файл вырос до 88 КБ и имеет чуть больше 5000 строк. Недавно я заметил, что стили, добавленные в конце, отсутствуют в браузере. Существует ли ограничение на размер файла CSS или на количество строк? EDIT: Извините, я забыл упомянуть, что эта проблема возникает в Windows 7 как в FireFox, так и в IE8. ...

Как вставить динамический текст в div с абсолютной позицией?

Взгляните на http://www.barelyfitz.com/screencast/html-training/css/positioning / пункт 6. Он гласит: Это не является жизнеспособным решением для большинства проектов, потому что мы обычно не знаем, сколько текста будет в элементах, или точные размеры шрифта, которые будут использоваться. Какой обходной путь мне нужно использовать, чтобы вставить динамический текст в div с абсолютной позицией? Приветствуется любой подход С уважением, ...

Используйте CSS для автоматического добавления звездочки "Обязательное поле" для формирования входных данных

Какой хороший способ преодолеть тот прискорбный факт, что этот код не будет работать так, как хотелось бы: <div class="required"> <label>Name:</label> <input type="text"> </div> <style> .required input:after { content:"*"; } </style> В идеальном мире все требуемые input s получили бы маленькую звездочку, указывающую, что поле является обязательным. Это решение невозможно, так как CSS вставляется после содержимого элемента, а не после сам ...