Als «css» getaggte Fragen

CSS (Cascading Style Sheets) ist eine Darstellungssprache, die zur Beschreibung des Erscheinungsbilds und der Formatierung von HTML-Dokumenten (HyperText Markup Language), XML-Dokumenten (Extensible Markup Language) und SVG-Elementen verwendet wird, einschließlich (aber nicht beschränkt auf) Farben, Layout, Schriftarten, und Animationen. Außerdem wird beschrieben, wie Elemente auf dem Bildschirm, auf Papier, in der Sprache oder auf anderen Medien gerendert werden sollen.

3
Schrumpfen Sie lieber in einem Flex-Container mit Flex-Flow: Reihenwicklung
Anzeigen einer Bildergalerie mit Bildern unterschiedlicher Größe und Verhältnis mit den folgenden Spezifikationen: Keine Leerzeichen (Ränder) zwischen den Bildern. Das ursprüngliche Verhältnis so weit wie möglich respektieren. Bilder umgeben von einem Link. Nicht-JS-Lösung. Bilder könnten etwas beschnitten werden. Tragbare Lösung. Die angezeigten Bilder sind zufällig. Bilder müssen von links nach …
2
Element von fest zu relativ auf Bildlauf
Ich habe einen Wrapper erstellt, in dem ich auf der Airpods Pro-Seite den gleichen Effekt wie Apple animiert habe . Es ist im Grunde ein Video, wenn ich scrolle, wird das Video Stück für Stück abgespielt. Die Position des Videos ist festgelegt, sodass der Text gut darüber rollt. Der Text …
2
SVG CSS Mehrere Animationen
Ich habe eine Schatzkartenanimation erstellt. Zuerst wird der Pfad in Hellgrau angezeigt. Zu Beginn der Animation möchte ich jedoch, dass die hellgrauen Striche verschwinden oder sich in eine schwarze Farbe verwandeln, wenn die Füllanimation ".road" aktiviert wird Probleme damit, dass die hellgrauen Striche ".steps" verschwinden, wenn die Füllanimationen über diese …
9 css  svg 
1
Benutzerdefinierter Effekt, der ein 3D-Rad mit Swiper 5 simuliert
Ich muss ein Karussell mit 12 Elementen bauen, die ein unendlich rotierendes 3D-Rad simulieren. Um klar zu sein, muss ich genau diesen Effekt erzeugen: https://codepen.io/SitePoint/pen/yXWXaw ( hier zu finden ) Aber mit diesen zusätzlichen Funktionen (insbesondere auf dem Desktop und auf Mobilgeräten): Folien müssen Schritt für Schritt dem Wischen folgen, …
2
Wie würde ich von Material-UI verwaltete Stile auf nicht-material-ui, nicht reagierende Elemente anwenden?
Ich habe eine Anwendung, in der ich die Material-Benutzeroberfläche und ihren Themenanbieter (mit JSS) verwende. Ich verwende jetzt Fullcalendar- React, was eigentlich keine vollwertige React-Bibliothek ist - es ist nur ein dünner React-Komponenten-Wrapper um den ursprünglichen Fullcalendar-Code. Das heißt, ich habe keinen Zugriff auf Dinge wie Render-Requisiten, um zu steuern, …
5
Verwenden Sie CSS, um „A“ am unteren Ende von „B“ auszurichten, wobei „B“ eine unbekannte Breite und einen unbekannten Textumbruch aufweist
Ich habe eine "sortierbare" Tabelle, in der die Kopfzeile der aktuell sortierten Spalte ein Symbol anzeigt: Das Sortiersymbol soll am Ende des Textes angezeigt werden (dh wir unterstützen LTR / RTL). Ich benutze gerade display:flex. Wenn jedoch die Tabellenbreite kleiner wird und der Text der Spaltenüberschrift zu umbrechen beginnt, stoße …
6
Seitenleiste Standardmäßig auf dem Desktop geöffnet, auf Mobilgeräten geschlossen
Ich habe einige echte Probleme beim Versuch, meine Seitenleisten- / Navigationsinhalte (mithilfe von Bootstrap) standardmäßig auf dem Desktop anzuzeigen (zu erweitern) und standardmäßig auf Mobilgeräten zu schließen und das Symbol nur auf Mobilgeräten anzuzeigen. Ich kann das scheinbar nicht zum Laufen bringen. <nav class="menu menu-open" id="theMenu"> <div class="menu-wrap"> <button class="navbar-toggler" …
2
Wie kann ich die Größe des ClipPath-Bereichs von SVG ändern?
Ich habe einen solchen Code: .img-container { width: 300px; height: 300px; background-color: lightgreen; overflow: hidden; } .clipped-img { clip-path: url('#header-clip-svg'); } <div class="img-container"> <!--clipping SVG--> <svg height="0" width="0"> <defs> <clipPath id="header-clip-svg"> <path d="M199.6,18.9c-4.3-8.9-12.5-16.4-22.3-17.8c-11.9-1.7-23.1,5.4-32.2,13.2c-9.1,7.8-17.8,16.8-29.3,20.3c-20.5,6.2-41.7-7.4-63.1-7.5C38.7,27,24.8,33,15.2,43.3c-35.5,38.2-0.1,99.4,40.6,116.2c32.8,13.6,72.1,5.9,100.9-15c27.4-19.9,44.3-54.9,47.4-88.6c0.2-2.7,0.4-5.3,0.5-7.9C204.8,38,203.9,27.8,199.6,18.9z"></path> </clipPath> </defs> </svg> <!-- clipped image--> <img class="clipped-img" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3341051/team.jpg"/> </div> Führen Sie das Code-Snippet ausErgebnisse ausblendenErweitern Sie …
8 css  svg  clip-path 
2
Wie kann ich dafür sorgen, dass "React-Beautiful-Dnd" keine "React-Transition-Group" -Animation auslöst?
Video zur Demonstration meines Problems: https://i.imgur.com/L3laZLc.mp4 Ich habe eine einfache App, in der Sie Karten zu 2 verschiedenen Zeilen hinzufügen können. Wenn einer Zeile eine Karte hinzugefügt wird, löse ich react-transition-groupeine "Enter" -Animation aus. Ich habe jedoch auch react-beautiful-dndinstalliert, um das Ziehen von Karten zwischen den Zeilen zu ermöglichen und …
2
Wie kann ich einen anderen Bildübergangseffekt verkleinern?
Ich möchte Bilder mit Verkleinerung auf das 2. Bild, das 3. Bild usw. übertragen. Ich habe versucht, es mit einigen Keyframes über Hintergrundbild und Skalierung selbst zu machen, und es hat anständig funktioniert, außer es gab zwei Probleme. 1. Mein Text und meine Schaltflächen wurden ebenfalls skaliert. 2. Die Dauer …
8 html  css 
2
Verwendung eines Textelements mit einer in CSS beschriebenen Schriftart in einer Zeichenfläche
Dies ist Teil des Bismon- Projekts (eine GPLv3 + -Software, die von europäischen H2020-Projekten finanziert wird), git commit0e9a8eccc2976f . Dieser Berichtsentwurf beschreibt die Software. Diese Frage gibt mehr Kontext und Motivationen. Es handelt sich um die (handgeschriebene) Datei webroot / jscript / bismon-hwroot.js , die in einer HTML-Seite verwendet wird, …
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.