Вопросы с тегом «css»

У меня есть таблица с номерами. Когда я нажимаю на ячейку в таблице, она переключает активное состояние. Я хочу выбрать одну ячейку и нажать crtl и выбрать другую ячейку, и в результате ячейки между первой и второй станут активными. Как это реализовать? codepen https://codepen.io/geeny273/pen/GRJXBQP <div id="grid"> <div class="cell">1</div> <div class="cell">2</div> …

16 javascript  html  css 

Я написал пользовательскую кнопку ( MyStyledButton) на основе материала-интерфейса Button . import React from "react"; import { Button } from "@material-ui/core"; import { makeStyles } from "@material-ui/styles"; const useStyles = makeStyles({ root: { minWidth: 100 } }); function MyStyledButton(props) { const buttonStyle = useStyles(props); const { children, width, ...others } …

16 javascript  css  reactjs  jestjs  enzyme 

Я пытаюсь создать анимацию в стиле американских горок с помощью CSS. Я хочу знать, как изогнуть «каботажное судно», когда оно находится в стадии цикла. Я ищу решение для всего CSS, но если есть необходимость немного JavaScript, я в порядке с этим. мой код до сих пор: #container { width: 200px; …

15 html  css  css-animations  css-transforms 

У меня есть следующий фрагмент (необходимо просмотреть в полноэкранном режиме), что я пытаюсь поместить <main>элемент непосредственно под <header>элементом. У меня <header>фиксированная позиция, потому что я хочу, чтобы она оставалась в верхней части экрана, когда пользователь прокручивает содержимое <main>элемента. Я перепробовал все, что знаю, но лучшее, что я могу придумать, это …

15 html  css  css-position  fixed 

Как сделать iframe отзывчивым, не предполагая соотношения сторон? Например, контент может иметь любую ширину или высоту, которые неизвестны до рендеринга. Обратите внимание, вы можете использовать Javascript. Пример: <div id="iframe-container"> <iframe/> </div> Измените размер iframe-containerтак, чтобы его содержимое едва помещалось внутри без дополнительного пространства, другими словами, для содержимого достаточно места, чтобы …

14 javascript  html  css  iframe  responsive-design 

Когда я набираю последнее число , первое число входит внутрь text-box(оно исчезает), оно добавляет один дополнительный пробел. После того, как я нажму снаружи, text-boxэто выглядит хорошо, что мне нужно во время ввода последнего символа. #number_text { padding-left: 9px; letter-spacing: 31px; border: 0; background-image: linear-gradient(to right, #e1e1e1 70%, rgba(255, 255, 255, …

14 javascript  jquery  html  css 

Я работаю над таблицей HTML и html-to-paperпечатаю эту таблицу на принтере, используя vue.js. Я нажимаю на кнопку «Добавить», создавая новую строку, а затем нажимаю кнопку «Печать». Я пытаюсь напечатать таблицу, но она не выполняется. любые данные, показывающие только пустые ячейки Код App.vue <template> <div id="app"> <button type="button" @click="btnOnClick">Add</button> <div id="printMe"> …

14 javascript  css  vue.js  printing  vuejs2 

Браузер Chrome автозаполнение удалено эффект background-colorи background-imageот Usernameи Passwordполей ввода. До автозаполнения После автозаполнения Но Chrome Browser автозаполнения скрыть мои значки от входов и также изменил мои background-color. Поэтому мне нужно, чтобы мои иконки оставались на входах как есть. Можно ли остановить браузер Chrome от изменения цвета фона полей и …

13 javascript  html  css  google-chrome 

В следующем примере, когда вы нажимаете на метку, вход меняет состояние. document.querySelector("label").addEventListener("click", function() { console.log("clicked label"); }); label { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } <input type="checkbox" id="1"> <label for="1">Label</label> Выполнить фрагмент кодаСкрыть результатыРазвернуть фрагмент В Chrome, при перемещении курсора между mousedownи mouseupсобытиями вход еще сработал, в …

13 javascript  html  css  label 

Проблема , кажется, что некоторые буквы , как g, y, qи т.д. , которые имеют хвост , что наклоны вниз, не позволяют для вертикального центрирования. Вот изображение, чтобы продемонстрировать проблему . Символы в зеленом поле в основном идеальны, так как у них нет нисходящего хвоста. Те, кто в красной коробке, …

12 javascript  html  css  vertical-alignment 

Пожалуйста, попробуйте запустить следующий фрагмент, затем нажмите на поле. const box = document.querySelector('.box') box.addEventListener('click', e => { if (!box.style.transform) { box.style.transform = 'translateX(100px)' new Promise(resolve => { setTimeout(() => { box.style.transition = 'none' box.style.transform = '' resolve('Transition complete') }, 2000) }).then(() => { box.style.transition = '' }) } }) .box …

11 javascript  css  promise  settimeout 

Я пытался сделать так, чтобы таблица соответствовала странице (А4), как показано на картинке: я много искал, но не нашел ничего полезного в Интернете. Я использую динамическую таблицу, все в порядке, кроме ширины таблицы. вот мой код: $content = '<table><thead><tr><th class="bg-dark text-white" align="center">#</th><th align="center" class="bg-dark text-white">Code</th><th align="left" class="bg-dark text-white">Description</th><th align="center" class="bg-dark …

11 php  html  css  tcpdf 

Я пытаюсь имитировать другие мобильные приложения чата, где при выборе send-message текстового поля и открытии виртуальной клавиатуры самое нижнее сообщение все еще отображается. Кажется, не существует способа сделать это с помощью CSS, так что JavaScriptresize (единственный способ выяснить, когда клавиатура открывается и закрывается, очевидно), события и ручная прокрутка для спасения. …

10 javascript  android  html  css  reactjs 

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

10 javascript  html  css  scroll  scrollbar 

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

10 html  css  mobile-safari  fullscreen