Wie erreiche ich eine Textur wie diese mit CSS3 Farbverläufen?Wie erreiche ich eine Textur wie diese mit CSS3 Farbverläufen?
-1
A
Antwort
2
Der erste Hintergrund ist repeating-linear-gradient
einfach mit:
body {
height:100vh;
width:100vw;
background:repeating-linear-gradient(
to bottom,
#58D68D 0,
#58D68D 30px,
#2ECC71 30px,
#2ECC71 60px
);
}
Der zweite Hintergrund viel komplizierter ist und sollte nicht eine CSS-Lösung sein. Ich empfehle stattdessen eine background-image
zu verwenden!
Es ist nicht unmöglich, es mit CSS zu lösen (mit perspective
):
body {
transform: perspective(100em) rotateX(50deg) scale(2);
overflow:hidden;
}
div {
height:100vh;
width:100vw;
background:repeating-linear-gradient(
to bottom,
rgba(46, 204, 113, 0.5) 0,
rgba(46, 204, 113, 0.5) 30px,
rgba(88, 214, 141, 0.5) 30px,
rgba(88, 214, 141, 0.5) 60px
), repeating-linear-gradient(
to right,
rgba(46, 204, 113, 0.5) 0,
rgba(46, 204, 113, 0.5) 30px,
rgba(88, 214, 141, 0.5) 30px,
rgba(88, 214, 141, 0.5) 60px
);
}
<div></div>
+0
Danke Sebastian – Jay
+0
@Jay - kein Problem, fühl dich frei, als gelöst zu markieren;) –
Verwandte Themen
- 1. Wie erreiche ich diese XML-Auszug .NET
- 2. Wie erreiche ich diese benutzerdefinierte Zahlenauswahl?
- 3. Wie style ich eine Select-Box mit Farbverläufen?
- 4. Wie erreiche ich Reaktionsfähigkeit?
- 5. Wie erreiche ich diese horizontale Linie von css oder bootstrap
- 6. Wie erreiche ich diese Eigenschaft/dieses Objekt/Array?
- 7. Wie erreiche ich diesen Seitenübergangseffekt?
- 8. Wie erreiche ich Bootstrap-Raster mit rowspan
- 9. Wie erreiche ich Mehrfachvererbung mit fabricJS Objekten?
- 10. Wie erreiche ich Remote PgAdmin4?
- 11. Wie erreiche ich dieses Layout?
- 12. Wie erreiche ich innerer Join mit SQLAlchemy?
- 13. Wie erreiche ich Circular Fortschrittsbalken?
- 14. Wie erreiche ich eine verbesserte Pymongo-Performance mit Threading?
- 15. Wie diese ovale Form in css3 machen
- 16. Kreisdiagramme mit linearen Farbverläufen - swift
- 17. Wie zeichne ich eine Textur in LibGDX?
- 18. Wie erreiche ich dieses Ergebnis in Rubin?
- 19. Wie erreiche ich eine Klasse von meinem Hauptformular?
- 20. salesforce Wie erreiche ich 75% Apex Test
- 21. Wie erreiche ich das Flusslayout in XUL?
- 22. Wie erreiche ich eine Tilde-Erweiterung in C?
- 23. Wie erreiche ich diesen coolen Fußzeileneffekt?
- 24. Wie erreiche ich mein Modell in Laravel?
- 25. Wie erreiche ich Routenparameter in der Middleware?
- 26. Wie wiederhole ich die Textur wie GL_REPEAT?
- 27. Wie erreiche ich diesen bestimmten Hover-Effekt?
- 28. Wie kann ich es mit CSS3 machen?
- 29. Wie style ich ein img mit CSS3
- 30. Wie erreiche ich das in Apache?
erste ist einfach, aber die zweite ein ... Wie auch immer, ist nicht empfehlenswert Verwenden von CSS zum Zeichnen komplexer Muster Zuletzt sind sie ** nicht ** Farbverläufe. – Raptor