css- все статьи тега ➜ страница 17
Скрытые полосы прокрутки не позволяют прокручивать страницы. (CSS) [дубликат]
На этот вопрос уже есть ответ здесь: Как отключить браузер или панель прокрутки элементов,но при этом разрешить прокрутку колесиком или стрелками? 7 ответов После использования кода: body{ overflow:hidden; } Полоса прокрутки исчезает с правой стороны страницы, но, как следствие, я больше не могу прокручивать страницу вверх или вниз, если не нажму кнопку мыши. колесо прокрутки на мыши и перетащит ...
Internet Explorer 11 перенос слов не работает
Похоже, что перенос слов больше не работает для элементов textarea в IE 11. В IE 10 и более ранних версиях FF, Safari и Chrome перенос слов работает должным образом. IE 11 не реализует никакого переноса слов. Я попытался добавить "wrap=hard "в тег textarea, а также добавить" word-wrap: normal; " в CSS. Кто-нибудь еще сталкивался с этой проблемой? Если да, то нашли ли вы решение? Windows выталкивает это обновление, и непоследовательное поведение становится проблема. Спасибо за любую помощь, ко ...
@media print не работает должным образом в Chrome
Нашли/прочитали / попробовали много ответов на этот вопрос, так что извините, если решение уже было опубликовано, но Chrome не отображает стили печати правильно со многими элементами отсутствует (но не все). Вот как все устроено. 1. SETUP Стили печати задаются в конце основного css файла с помощью @media print На ссылке нет атрибута media, который загружает css-файл Мы объявляем !important на всех стили печати Стили печати переопределяют стили экрана там, где это необходимо (т. е.@me ...
Materializecss sidenav не работает
Я пытаюсь заставить sidenav работать для фреймворка Materializecss. MATERIALIZECSS http://next.materializecss.com/getting-started.html SIDENAV DEMO http://next.materializecss.com/sidenav.html Мой кодовый ключ https://codepen.io/gregoryksanders/pen/RxoyqB <head> <!--Import Google Icon Font--> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <!-- Compiled and minified CSS --> <link rel="stylesheet" href="htt ...
Что делает этот CSS селектор?
Я заметил этот (для меня) любопытный стиль css на сайте по умолчанию.css файл an ASP.NET проект MVC: .text-box.multi-line { height: 6.5em; } Является ли .text-box.multi-line просто именем класса, в середине которого есть точка, или это вложенность двух классов? Или это что-то совсем другое? Ты можешь объяснить? И можете ли вы привести пример использования? Edit Спасибо за все ответы. Это, по-видимому, упущение из справочной страницы W3Schools css. ...
Как определить поддержку атрибута стиля "scoped"
Существует ли рекомендуемый тест для определения того, поддерживает ли браузер пользователя атрибут" scoped "в элементах" style"? ...
Изменение цвета текста на навигационной панели с помощью Materialize CSS (rails)
Я хочу создать навигационную панель с белым фоном и черным текстом, но мне не удалось получить текст в ссылках внутри навигационной панели, чтобы он был не белым. Вещи, которые я пробовал: - добавление класса "черный текст" на Ли теги, тег ул, окружающие теги div и Навь - определение класса в моем приложении.scss-файл для каждого тега li. - добавление li, nav, a { color: black;} в мое приложение.scss файл Вот html для навигационной панели: <header class="nav"> <nav&g ...
html-воспроизведение gif один раз при наведении и воспроизведение в обратном порядке при наведении мыши
Я хочу иметь GIF, который воспроизводится один раз, когда вы наведете на него курсор мыши и остановитесь на последнем кадре, а затем, когда вы переместите мышь с изображения, он должен воспроизводиться назад и останавливаться на первом кадре. У меня есть статическое изображение для первого и последнего кадра, а также отдельные анимированные GIF-файлы, воспроизводящие анимацию вперед и назад, я просто не знаю, как я буду это программировать. Оптимально я бы просто использовал CSS, но из того, ч ...
Создание высоты div 100% от высоты порта просмотра или всей высоты страницы
Если вы посмотрите на этот пример jsfiddle: http://jsfiddle.net/2YbpZ/ Вы можете видеть, что оба элемента sidebar и content тянутся к нижней части окна просмотра. Вот чего я хочу. Однако, когда дается некоторый контент, который растягивает страницу и требует от пользователя прокрутки: http://jsfiddle.net/p6qGg/ Дивы sidebar и content отсекаются в нижней части иллюминатора. Я знаю, почему это происходит, потому что 100% относится ко всему высота родительского элемента, который в данном случа ...
Как загрузить изображения, используемые в таблице стилей sass в webpack?
Я использую Webpack для связывания моих модулей и использую sass для стилизации в приложении на основе react. Используя отдельную таблицу стилей, я устанавливаю фоновое изображение компонента и загружаю эту таблицу стилей в index.js. Все стили в таблице стилей применяются к этому компоненту , кроме фонового изображения. Вот мой образец таблицы стилей $bg-img: url('/img/bg.jpg'); .show { position: relative; background: $black $bg-img center center; width: 100%; height: 100% ...
Вогнутый четырехугольник из прямоугольника
Используя только CSS, можно ли создать четырехугольник с внутренним углом больше 180 градусов, манипулируя одним прямоугольником? Я знаю, что произвольный выпуклый четырехугольник может быть создан из стандартного прямоугольника с помощью преобразований CSS3. Мне удалось создать вогнутые многоугольники, используя несколько прямоугольников несколькими различными способами (иногда с помощью скрытого переполнения); некоторая комбинация: соседние прямоугольники. Это проблема в том, что визуальн ...
Как резко остановить линейный анимированный ползунок jQueryUI handle (crossbrowser)
Мы используем слайдер jQuery для нашего слайд-шоу. Теперь ручка анимируется во время воспроизведения. Но если пользователь делает паузу, ручка должна быть немедленно установлена в неподвижное положение (т. е. анимация должна быть остановлена). Сначала я подумал, что будет проще всего использовать опцию animate (http://api.jqueryui.com/slider/#option-animate ) из слайдера. Но я не нашел способа создатьлинейную анимацию. Таким образом, мы решили эта проблема теперь с помощью CSS-переходов. Есл ...
CSS overflow-только 1 строка текста
У меня есть div со следующим стилем css: width:335px; float:left; overflow:hidden; padding-left:5px; Когда я вставляю в эту div длинную строку текста, она разрывается на новую строку и отображает весь текст. Я хочу иметь только одну строку текста,которая не будет прерываться. Когда текст длинный, я хочу, чтобы этот переполненный текст исчез. Я думал о том, чтобы установить высоту, но, кажется, это неправильно. Может быть, если я добавлю высоту, которая совпадает с шрифтом, это должно раб ...
Div дисплей: начальный не работает, как предполагалось в ie10 и chrome 29
Я хочу отобразить div со следующими ограничениями: автоматически скрывается под шириной 1024px можно переключать кнопкой под шириной 1024px, но если я нажму somwhere (не внутри div), класс activeDiv должен быть удален У меня есть фиктивный пример в codepen Таким образом, возникли следующие проблемы: в IE10 кнопка переключения просто не работает (не Скрыть / показать div) я проверяю с помощью инструментов разработчика, но никаких признаков display: initial в Chrome 29 div появляется ...
Изменение цвета SVG при наведении на родительский элемент
У меня есть меню. Каждый пункт меню имеет изображение SVG и текст. SVG встроен с помощью <object> <ul id="menu-content" class="menu-content collapse out"> <li id="calculator"> <a href="#"> <tr> <td> <object type="image/svg+xml" data="assets/calculator.svg"> </object> </td> <td class="menu-option"> <span class="menu-option"> Pricing & Services ...
Как работают CSS треугольники?
есть много различных форм CSS в CSS трюки-формы CSS и я особенно озадачен треугольником: #triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } <div id="triangle-up"></div> Как и почему это работает? ...
Когда использовать margin vs padding в CSS
при написании CSS, есть ли определенное правило или руководство, которое должно использоваться при принятии решения, когда использовать margin и когда использовать padding? ...
Как придать тексту или изображению прозрачный фон с помощью CSS?
возможно ли, используя только CSS, сделать background элемента полупрозрачного, но имеют ли содержимое (текст и изображения) элемента непрозрачным? Я хотел бы сделать это без текста и фона в виде двух отдельных элементов. при попытке: p { position: absolute; background-color: green; filter: alpha(opacity=60); opacity: 0.6; } span { color: white; filter: alpha(opacity=100); opacity: 1; } <p> <span>Hello world</span> </p> похоже ...
Как выровнять флажки и их метки последовательно кросс-браузеры
Это одна из незначительных проблем CSS, которая постоянно беспокоит меня. Как люди вокруг переполнения стека вертикально выравнивают checkboxes и labels последовательно кросс-браузер? Всякий раз, когда я правильно выравниваю их в Safari (обычно используя vertical-align: baseline на input), они полностью отключены в Firefox и IE. Исправьте это в Firefox, и Safari и IE неизбежно испортятся. Я трачу время на это каждый раз, когда я кодирую форма. вот стандартный код, с которым я работаю: ...
Сделайте div заполнить высоту оставшегося пространства экрана
в настоящее время я работаю над веб-приложением, где я хочу, чтобы контент заполнял высоту всего экрана. страница имеет заголовок, который содержит логотип и информацию о счете. Это может быть произвольная высота. Я хочу, чтобы содержимое div заполнило остальную часть страницы внизу. у меня есть заголовок div контент div. На данный момент я использую таблицу вот так: CSS и HTML #page { height: 100%; width: 100% } #tdcontent { height: 100%; } #content { overflow: a ...