Програмування css

6

Як розмістити таблицю в центрі сторінки за допомогою CSS?

Я використовую наступний код. Як розмістити цю таблицю в центрі сторінки за допомогою CSS? <html> <head> <link rel="stylesheet" type="text/css" href="styles.css" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>The Main Page</title> </head> <body> <table> <tr> <td><button class="lightSquare"></button></td> <td><button class="darkSquare"></button></td> <td><button class="lightSquare"></button></td> <td><button class="darkSquare"></button></td> <td><button class="lightSquare"></button></td> <td><button class="darkSquare"></button></td> <td><button class="lightSquare"></button></td> <td><button class="darkSquare"></button></td> </tr> </table> …

81 html css html-table center

5

Як вибрати елемент, який має певний клас?

Я розумію, що використання element.classмає дозволяти певному елементу, призначеному класу, отримувати інший "стиль", ніж решта класу. Це не питання про те, чи слід цим користуватися чи ні, але я намагаюся зрозуміти, як цей селектор призначений для роботи. Переглядаючи безліч прикладів в Інтернеті, я вважаю, що синтаксис правильний і не розумію, …

81 html css syntax css-selectors

10

запобігти: після перенесення елемента після наступного рядка

У мене є такий HTML: <ul> <li class="completed"><a href="#">I want the icon to stay on the same line as this last <strong>word</strong></li> </ul> Я додаю піктограму за допомогою псевдоелемента: after: ul li.completed a:after { background:transparent url(img.png) no-repeat; content: ''; display:inline-block; width: 24px; height: 16px; } Проблема: якщо доступна ширина занадто …

81 css

8

Зупинити перехід CSS від запуску при завантаженні сторінки

У мене виникла проблема із transitionвластивістю CSS, яка запускається під час завантаження сторінки. Проблема полягає в тому, що коли я застосовую color transitionелемент до елемента, (наприклад:), transition: color .2sтоді, коли сторінка вперше завантажує мої елементи, блимає від чорного до власного призначеного кольору. Припустимо, у мене є такий код: CSS p.green …

81 html css google-chrome

10

Непрозорість фонового зображення CSS?

Пов’язане з тим, як надати тексту чи зображенню прозорий фон за допомогою CSS? , але дещо інший. Я хотів би знати, чи можна змінити альфа-значення фонового зображення , а не лише колір. Очевидно, що я можу просто зберегти зображення з різними значеннями альфа, але я хотів би мати можливість динамічно …

81 html css

12

Виключіть спалах нестильового вмісту

Як зупинити спалах нестильового вмісту (FOUC) на веб-сторінці?

81 css fouc

11

Затримка анімації CSS при повторенні

Нещодавно я виявив, як "правильно" використовувати анімації CSS (раніше я відхилив їх, оскільки не мав змоги створювати складні послідовності, як це можна було робити в JavaScript). Тож зараз я дізнаюся про них. Для цього я намагаюся зробити градієнтний "спалах", що проходить через елемент, подібний до індикатора прогресу. Подібно до впливу …

81 css css-animations

13

Nginx не завантажує файли CSS

Нещодавно я вирішив перейти з Apache2 на Nginx. Я встановив Nginx на своєму сервері CentOS і встановив базову конфігурацію. Коли я намагався завантажити свій сайт у браузері (FF / Chrome), я помітив, що файл css не завантажується. Я перевірив консоль помилок і побачив таке повідомлення: Error: The stylesheet http://example.com/style.css was …

81 css nginx mime

5

Чи можна побачити, яке зображення srcset використовує браузер за допомогою інструментів розробника браузера

Я намагався побачити, яке srcsetзображення використовує мій браузер за допомогою інструментів розробника браузерів, але окрім використання вкладки мережі, щоб побачити, яке зображення воно отримує, я не можу сказати. Як правило, використання мережевої вкладки було б нормальним, але іноді я помічав, що вона отримує 2 версії зображень різного розміру, це траплялося …

81 html css responsive-design developer-tools srcset

4

Чи можна завжди відображати стрілки вгору / вниз для введення “числа”?

Я хочу завжди показувати стрілки вгору / вниз для поля введення "число". Чи можливо це? Поки що мені не пощастило ... http://jsfiddle.net/oneeezy/qunbnL6u/ HTML: <input type="number" /> CSS: input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: "Always Show Up/Down Arrows"; }

81 html css input webkit shadow-dom

4

Стіл зі столом-макетом: фіксований; і як зробити один стовпець ширшим

Отже, у мене є таблиця з таким стилем: table-layout: fixed; Що робить усі стовпці однаковою шириною. Я хотів би, щоб один стовпець (перший) був ширшим, а потім решта стовпців, щоб зайняти решту ширини таблиці з однаковими ширинами. Як цього досягти? table { border-collapse: collapse; width: 100%; border: 1px solid black; …

81 html css xhtml

4

Як реалізувати max-font-size?

Я хочу вказати мій розмір шрифту, використовуючи vw, як у font-size: 3vw; Однак я також хочу обмежити розмір шрифту до 36 пікселів. Як я можу досягти еквівалента max-font-size, якого не існує - чи є єдиним варіантом використання медіа-запитів?

81 css viewport-units

11

Розмір стилю списку CSS-зображення

Я намагаюся встановити власні піктограми SVG із CSS для <ul>елементів списку. Приклад: <ul> <li style="list-style-image: url('first.svg')">This is my first item</li> <li style="list-style-image: url('second.svg')">And here's my second</li> </ul> Проблема полягає в тому, що зображення занадто великі і розтягують висоту ліній. Я не хочу змінювати розмір зображення, оскільки сенс використання SVG полягає …

81 html css

1

CSS3 односторонній перехід?

Використовуючи переходи CSS3, можна мати ефект `` згладжування '' та `` згладжування '' до будь-якої властивості. Чи можу я налаштувати його так, щоб він мав лише ефект згладжування? Я хотів би, щоб рішення було лише в CSS, уникаючи JavaScript, якщо це можливо. Логічний потік: Користувач клацає елементом Перехід займає 0,5 …

81 html css

12

Заповнювач для задоволеного div

У мене є таке: FIDDLE Заповнювач чудово працює і працює, поки ви не введете щось, ctrl+ A, і delete. Якщо ви зробите це, заповнювач зникає і більше ніколи не з’являється. Що не так? Як я можу отримати заповнювач для задоволеного div? HTML: <div class="test" placeholder="Type something..." contenteditable="true"></div> CSS: .test { …

81 javascript jquery html css

Запитання з тегом «css»