Gerade Linie anlegen (hr css generator)

[tunneltruppe]

Guten Abend,
ich versuche gerade gerade - Abtrennungslinien für meine Visu zu erstellen.
Nun versuche ich gerade mit den CSS Code zu spielen.
Als Anfänger nicht gerade einfach.
Also suchte ich mit Netz nach einen hr css generator.
Für Hintergrundblider habe ich etwas gefunden.
Z.B. für diese Linie:
linie 1.jpg
sieht der Code so aus:
border: 0; height: 1px; background: #333; background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); background-image: -moz-linear-gradient(left, #ccc, #333, #ccc); background-image: -ms-linear-gradient(left, #ccc, #333, #ccc); background-image: -o-linear-gradient(left, #ccc, #333, #ccc);
Zum "spielen" für die Visu finde ich die Änderungen per Hand sehr aufwendig.
Hat einer eine Idee wie man das schneller zum Üben ändern/ spielen kann?
Gruß Marcus

[tger977]

das ist ja ein einfacher Farbverlauf. Leg doch einfach eine dynamische Farbe mit Farbdefinition:

-webkit-linear-gradient(left, #ccc, #333, #ccc)

an und nutze dann das Universalelement mit Randfunktion und der entsprechenden Farbe für die Visu.

Beim Farbenanlegen gibts auch eine Vorschau per einfachem Klick mit der man das sehr gut "justieren" kann.

[toggle]

In Chrome Ctrl-Shift-I eingeben => Seiten-Debugmodus. Mit dem Zeigertool ein Seitenelement auswählen und im Styles-Fenster manuelle Änderungen testen.

[vento66]

Ah Du meinst F12... War gerade etwas verwirrt, die Kombi kannte ich nicht.

[eghetto]

Zum Spielen ist:

https://jsfiddle.net/wfrqj17s/1/

ganz gut.

Nette Inspiration:
http://www.cssportal.com/blog/style-hr-tag-with-css/

[tunneltruppe]

Zum Spielen ist:

https://jsfiddle.net/wfrqj17s/1/

ganz gut.

Nette Inspiration:
http://www.cssportal.com/blog/style-hr-tag-with-css/

....das hatte ich gesucht (ansich auch gefunden, aber erst nicht verstanden, wie ich das eingeben sollte,
aber jetzt mal mit gespielt, echt nett!!!)
DANKE euch allen!!!

[tunneltruppe]

Habe hier noch einen Beitrag vom Edomi- Meister dazu gefunden:
https://knx-user-forum.de/forum/proj...83#post1010383

so zusagen eine Doppel- Linie:
doppellinie.jpg

Also im CSS- Feld, das eingeben:
border-top:2px ridge #778899
Gruß Marcus