Pytania otagowane jako css

CSS (Cascading Style Sheets) to język arkusza stylów reprezentacji używany do opisywania wyglądu i formatowania dokumentów HTML (HyperText Markup Language), XML (Extensible Markup Language) i elementów SVG, w tym (między innymi) kolorów, układu, czcionek, i animacje. Opisuje także, w jaki sposób elementy powinny być renderowane na ekranie, na papierze, w mowie lub na innych mediach.

10
Jak usunąć dziwne luki między trzema divami o tym samym kolorze tła?
Od dłuższego czasu walczę z tym problemem. Problem można zobaczyć na urządzeniach mobilnych (Android i iOS), niektóre urządzenia mogą wymagać nieco większego powiększenia. Na komputerze mogę również odtworzyć ten błąd w przeglądarce Chrome po przełączeniu do trybu mobilnego. Poniżej znajduje się kod używany do odtworzenia błędu: <!DOCTYPE html> <html lang="en"> …
23 html  css 
7
Usuń poprzednio ustawiony kolor obramowania
function validate() { var username = document.getElementById("username").value; var password = document.getElementById("password").value; if (username == "") { document.getElementById("message").innerHTML = "USERNAME CANNOT BE EMPTY"; document.getElementById("username").style.borderColor = "red"; return false; } if (password == "") { document.getElementById("message").innerHTML = "PASSWORD CANNOT BE EMPTY"; document.getElementById("password").style.borderColor = "red"; return false; } } #username:focus { background-color: yellow; …
20 javascript  html  css 
8
Jak mogę udowodnić, że dwie strony HTML wyglądają identycznie?
Mam na przykład: <pre> sun<br/>     mercury <br/>     venus <br/>         earth <br/>         mars <br/>             jupiter <br/>     saturn <br/> </pre> Uruchom fragment koduUkryj wynikiRozwiń fragment kodu i to: <div style="font-family:monospace"> <div style="text-indent: 0">sun</div> <br/> <div style="text-indent: 4ch">mercury</div> <br/> <div style="text-indent: 4ch">venus</div> <br/> <div style="text-indent: 8ch">earth</div> <br/> <div style="text-indent: 8ch">mars</div> <br/> <div style="text-indent: …
19 html  css  acid3 
5
Nie zezwalaj na przewijanie w poziomie podczas przewijania w pionie (i odwrotnie)
Mam listę, z overflow-xoraz overflow-yzestaw do auto. Ponadto skonfigurowałem przewijanie pędu, więc przewijanie dotykowe działa dobrze w urządzeniach mobilnych, przy użyciu webkit-overflow-scrolling: true. Problem polega jednak na tym, że nie mogę dowiedzieć się, jak wyłączyć przewijanie w poziomie podczas przewijania w pionie. Prowadzi to do naprawdę złych wrażeń dla użytkownika, …
10
Tworzenie div równych rozmiarów z zawijaniem
Próbuję stworzyć system menu z obrazem i tekstem powyżej i poniżej. Dane są dynamiczne. Chcę, aby system menu pojawił się w taki sposób, aby każdy obraz był w równej odległości od siebie, tak aby ustawiał się w siatce obrazów zarówno w poziomie, jak i w pionie. Problemem jest tekst. Jeśli …
17 html  css  flexbox 
2
Jak tworzyć przerywane okręgi o jednolitych odstępach?
Chciałem zrobić kropkowany okrąg za pomocą CSS i utworzyłem go w następujący sposób. Chociaż ten proces może wyświetlać przerywany okrąg, przerwa między końcem a początkiem przerywanej linii stała się wąska, a odstęp nie był jednolity. .c { width: 500px; height: 500px; border-width: 15px; border-style: dashed; border-radius: 600px; } <div class="c"></div> …
16 javascript  html  css 
8
Jak zaznaczyć wiele komórek za pomocą Ctrl + kliknięcie
Mam stolik z liczbami. Po kliknięciu komórki w tabeli przełącza ona stan aktywny. Chcę wybrać jedną komórkę i nacisnąć crtl i wybierz inną komórkę, w wyniku czego komórki między pierwszą a drugą staną się aktywne. Jak to wdrożyć? codepen https://codepen.io/geeny273/pen/GRJXBQP <div id="grid"> <div class="cell">1</div> <div class="cell">2</div> <div class="cell">3</div> <div class="cell">4</div> …
16 javascript  html  css 
1
Dlaczego getComputedStyle () w teście JEST zwraca różne wyniki do obliczonych stylów w Chrome / Firefox DevTools
Napisałem niestandardowy przycisk ( MyStyledButton) oparty na interfejsie materiałowym 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 } …
6
Pozycjonowanie przewijalnej zawartości w stałym menu nawigacji Flexbox
Mam następujący fragment kodu (muszę wyświetlić w trybie pełnoekranowym), że próbuję umieścić <main>element bezpośrednio pod <header>elementem. Mam <header>stałą pozycję, ponieważ chcę, aby pozostała na górze ekranu, gdy użytkownik przewija zawartość <main>elementu. Próbowałem wszystkiego, co wiem, ale najlepsze, co mogę wymyślić, to <header>umieścić element na wierzchu <main>elementu, co odcina dużą część …
15 html  css  css-position  fixed 
4
Jak sprawić, by iframe reagował bez założenia współczynnika proporcji?
Jak sprawić, by iframe reagował bez zakładania współczynnika proporcji? Na przykład treść może mieć dowolną szerokość lub wysokość, która jest nieznana przed renderowaniem. Uwaga: możesz używać Javascript. Przykład: <div id="iframe-container"> <iframe/> </div> Zmień to iframe-containertak, aby jego zawartość ledwo mieściła się w środku bez dodatkowej przestrzeni, innymi słowy, jest wystarczająco …
8
Pierwszy numer wchodzi do środka, gdy wpisz ostatni numer w polu tekstowym
Kiedy wpisuję ostatnią cyfrę , pierwsza cyfra wchodzi do text-box(znika), dodaje jedną dodatkową spację. Po kliknięciu na zewnątrz text-boxwygląda dobrze, czego potrzebuję podczas pisania ostatniego znaku. #number_text { padding-left: 9px; letter-spacing: 31px; border: 0; background-image: linear-gradient(to right, #e1e1e1 70%, rgba(255, 255, 255, 0) 0%); background-position: left bottom; background-size: 38px 1px; …
14 javascript  jquery  html  css 
3
Drukowanie elementów za pomocą VueJS przy użyciu bibliotek stron trzecich
Pracuję nad tabelą HTML i html-to-paperdrukuję tę tabelę na drukarce przy użyciu vue.js. Po kliknięciu dodaj dodaj nowy wiersz, a następnie po kliknięciu wydruku próbuję wydrukować tabelę, ale to nie zajmuje wszelkie dane pokazujące tylko puste komórki Kod App.vue <template> <div id="app"> <button type="button" @click="btnOnClick">Add</button> <div id="printMe"> <table class="table table-striped …
5
Jak uniknąć ukrywania przez Chrome obrazu i koloru tła w polu autouzupełniania
Przeglądarka Chrome auto-fill usuwa efekt background-colori background-imageod Usernamei Passwordpól wejściowych. Przed autouzupełnianiem Po autouzupełnianiu Ale autouzupełnianie przeglądarki Chrome ukrywa moje ikony przed danymi wejściowymi, a także zmieniało moje background-color. Potrzebuję więc, aby moje ikony pozostały na wejściach takimi, jakie są. Czy można zatrzymać przeglądarkę Chrome przed zmianą koloru tła pól …
5
Etykieta HTML nie wyzwala odpowiedniego wejścia, jeśli mysz zostanie poruszona podczas klikania w przeglądarce Firefox
W poniższym przykładzie kliknięcie etykiety powoduje zmianę stanu danych wejściowych. 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> Uruchom fragment koduUkryj wynikiRozwiń fragment kodu W Chrome, gdy przesuwasz kursor między zdarzeniami mousedowni mouseup, dane wejściowe są …
13 javascript  html  css  label 
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.