Seite 2 von 2

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 10.01.2016 21:53
von unicorn75
Ja aber er bringt mich auch nicht vom Codeschnipsel einer css Datei zum jeweiligen Part der Webseite. Ansonsten aber sicherlich Hilfreich.

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 10.01.2016 22:02
von Talk19zehn
Ja, der Eindruck entsteht und doch doch .. m.E macht´s die Kombination, welche nicht gaaaaanz so einfach ist (Informationen uvm.).

Grüße

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 17.01.2016 16:05
von Klaus 1412
Ich habe gut zwei Tage damit verbracht, meine Stylesheets neu anzupassen - mit Firebug für Firefox.

Im Prinzip ist es relativ einfach, wenn man sich ein wenig mit CSS auskennt. Im linken Fenster (im HTML-Code) den Bereich mit dem Mauszeiger überfahren, den man untersuchen möchte (wird in der Vorschau blau markiert). Das gesuchte HTML-Tag markieren und im rechten Teilfenster den CSS-Code untersuchen bzw. verändern. Die Live-Vorschau zeigt direkt die Auswirkung.

In der entsprechenden CSS-Datei den Wert entsprechend ändern, abspeichern und Seite neu laden.

Dummerweise gibt es im ungünstigsten Fall gleich mehrere Dateien, mit Einträgen für eine ID oder Klasse. Da schlägt halt der Informatiker durch: je komplizierter, umso besser - muss ja nicht jeder verstehen - oder anders ausgedrückt, man hätte es sicherlich auch einfacher gestalten können.

Um einen Syle wirklich gut anpassen zu können, muss man ggf. noch eigene Klassen dazupacken oder in nachfolgenden Beschreibungen ergänzen. :wink:

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 17.01.2016 16:37
von Talk19zehn
Tja, stimmt schon __> gewusst wie. Eine differenzierte Anleitung habe auch ich nicht gefunden. :cry:

Das KnowHow ist mühsam, wenn einem zur Umsetzung, dem Prozedere
Klaus 1412 hat geschrieben: In der entsprechenden CSS-Datei den Wert entsprechend ändern, abspeichern und Seite neu laden.

Dummerweise gibt es im ungünstigsten Fall gleich mehrere Dateien, mit Einträgen für eine ID oder Klasse. Da schlägt halt der Informatiker durch: je komplizierter, umso besser - muss ja nicht jeder verstehen - oder anders ausgedrückt, man hätte es sicherlich auch einfacher gestalten können.


.. so einiges nicht plausibel oder möglich ist, gar verständlich erscheint. Insofern kann man kaum abhelfen, wenn derartige Fragen gestellt sind. Die Antwort steht und fällt mit dem Hintergrundwissen. Man sollte ggf. den dortigen Support aufsuchen. Klar ist, dass phpBB.de dies nicht leisten kann.

Man kann nur ein Werkzeug kundtun, die Einstellungen und Vorgaben liegen allein beim Anwender. :wink: Eine verbindliche anstatt einer pauchalen Vorgehensweise gibt es eben nicht wirklich.

Grüße

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 17.01.2016 17:47
von unicorn75
Klaus 1412 hat geschrieben:Ich habe gut zwei Tage damit verbracht, meine Stylesheets neu anzupassen - mit Firebug für Firefox.

Im Prinzip ist es relativ einfach, wenn man sich ein wenig mit CSS auskennt. Im linken Fenster (im HTML-Code) den Bereich mit dem Mauszeiger überfahren, den man untersuchen möchte (wird in der Vorschau blau markiert). Das gesuchte HTML-Tag markieren und im rechten Teilfenster den CSS-Code untersuchen bzw. verändern. Die Live-Vorschau zeigt direkt die Auswirkung.

In der entsprechenden CSS-Datei den Wert entsprechend ändern, abspeichern und Seite neu laden.

Dummerweise gibt es im ungünstigsten Fall gleich mehrere Dateien, mit Einträgen für eine ID oder Klasse. Da schlägt halt der Informatiker durch: je komplizierter, umso besser - muss ja nicht jeder verstehen - oder anders ausgedrückt, man hätte es sicherlich auch einfacher gestalten können.

Um einen Syle wirklich gut anpassen zu können, muss man ggf. noch eigene Klassen dazupacken oder in nachfolgenden Beschreibungen ergänzen. :wink:
Naja wenn man ewig nichts mehr mit programmieren zu tun hatte und dann (fast) keinerlei css und php Vorkenntnisse besitzt versucht man es erstmal einfach zu halten ;-). Also Firebug ist auf jeden Fall sehr gut zu gebrauchen, habe leider wenig Zeit momentan aber kann immer mehr CSS Anweisungen in der colours.css nachvollziehen es wird aber kompliziert, wenn man den vorhanden/zuständigen Codebereich nicht "erwischt" beim durchgehen aller Forenbereiche. Ich werde hier bestimmt am Ende ein paar Anweisungen nachfragen müssen, wenn ich es einfach nicht finde aber ich probier gern auf eigene Faust.

P.S. wegen deinem Verweis auf Informatiker :grin: - ich habe auch vor 15 Jahren einen recht guten Abschluss als Anwendungsentwicklerin hingelegt aber darin keine Arbeit gefunden und kurze Zeit später aufgehört mich damit zu beschäftigen :oops:

Talk19zehn hat geschrieben:Tja, stimmt schon __> gewusst wie. Eine differenzierte Anleitung habe auch ich nicht gefunden. :cry:

Das KnowHow ist mühsam, wenn einem zur Umsetzung, dem Prozedere
Klaus 1412 hat geschrieben: In der entsprechenden CSS-Datei den Wert entsprechend ändern, abspeichern und Seite neu laden.

Dummerweise gibt es im ungünstigsten Fall gleich mehrere Dateien, mit Einträgen für eine ID oder Klasse. Da schlägt halt der Informatiker durch: je komplizierter, umso besser - muss ja nicht jeder verstehen - oder anders ausgedrückt, man hätte es sicherlich auch einfacher gestalten können.


.. so einiges nicht plausibel oder möglich ist, gar verständlich erscheint. Insofern kann man kaum abhelfen, wenn derartige Fragen gestellt sind. Die Antwort steht und fällt mit dem Hintergrundwissen. Man sollte ggf. den dortigen Support aufsuchen. Klar ist, dass phpBB.de dies nicht leisten kann.

Man kann nur ein Werkzeug kundtun, die Einstellungen und Vorgaben liegen allein beim Anwender. :wink: Eine verbindliche anstatt einer pauchalen Vorgehensweise gibt es eben nicht wirklich.

Grüße
Hier wird sehr gut weitergeholfen, bin vollauf zufrieden. ich arbeite mich jetzt eben nach und nach durch alles durch, dabei lerne ich es kennen. Mir ist es so lieber als einfach nur das neueste phpb runterzuladen, keinerlei Änderungen vorzunehmen und einfach als Forum anzubieten - wenn dann Probleme auftauchen, während das forum im betrieb ist - das wird lustig :D
Jetzt sind eben die Farben dran, danach muss ich mich in das Design einarbeiten wie statt Logo ein Banner, ohne die Site-Logo extension zu nutzen, welches sich möglichst an verschiedenen Seitengrößen anpasst. Die Suchbox nach unten etc. Aber dies ist alles später dran und dann gibt es bei Fragen ja das forum mit Lösungsansätzen und ansonsten darf man dumm fragen :lol:

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 17.01.2016 17:55
von Kirk
Evtl. nützt einem dieses Video um sich mit Firebug etwas vertrauter zu machen.

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 17.01.2016 18:28
von unicorn75
Kirk hat geschrieben:Evtl. nützt einem dieses Video um sich mit Firebug etwas vertrauter zu machen.
Danke!

Vielleicht ne dumme frage aber trotzdem ^^ Spielt die Reihenfolge der css Anweisungen innerhalb der colours.css eine rolle?

Nachtrag weitere frage 8)

Code: Alles auswählen

html, body {
        color: black;

<!-- background-color: silver;  -->
        background: #FFCC00;
        background: -moz-linear-gradient(top, #FFCC00 0%, #ffffff 66.6%, #339933 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFCC00), color-stop(66.6%, #ffffff) ,color-stop(100%, #339933));
        background: -webkit-linear-gradient(top, #FFCC00 0%, #ffffff 66.6%, #339933 100%);
        background: -o-linear-gradient(top, #FFCC00 0%, #ffffff 66.6%, #339933 100%);
        background: -ms-linear-gradient(top, #FFCC00 0%, #ffffff 66.6%, #339933 100%);
        background: -prefix-linear-gradient(top, #FFCC00 0%, #ffffff 66.6%, #339933 100%);
        background: linear-gradient(to bottom, #FFCC00 0%, #ffffff 66.6%, #339933 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFCC00', endColorstr='#339933', GradientType=0 );
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFCC00', endColorstr='#339933', GradientType=1)";

}
Wenn ich den Forenhintergrund mit einem Farbverlauf versehen will, reicht dann "background" oder muss ich "background-image" nutzen? Ich kann gerade nur mit dem aktuellen FF testen (werde morgen mal ein paar weitere Browser installieren) und da geht es so.

Ich habe das zu code der colours.css für die Button mit farbverläufe genutzt und eben dieses gefunden http://gradcolor.com/css3-gradient.php?c=3 wo es mit "background-image" umgesetzt wird.

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 17.01.2016 19:39
von Talk19zehn
Hi, das sind nur wenige Seiten; Sehr schön siehst du hier, was man u.U. momentan für Farbverläufe braucht, nutzt: http://www.colorzilla.com/gradient-editor/
Siehe dort z.B.:
background: #1e5799; /* Old browsers */ ... ff
Oder schaue auch mal hier vorbei: http://www.w3schools.com/cssref/pr_background-image.asp

Im Grunde kann man sich am QT von phpBB selbst orientieren.
Da die Styles Submission Policy (3.1.x) informiert, sei der Hinweis auszugsweise (siehe Browser==>For Board Styles) ...
...(...)...
•All submissions need to be compatible with the latest version of phpBB 3.1. See the Style Changes page for more information.
•Submissions must be compatible with Internet Explorer 8 (and above) and Firefox. ◦If there are minor display issues with your style in a specific browser (i.e. Internet Explorer 8), it may still be submitted as long as it does not interfere with any phpBB functionality. Please detail any known display issues with your style upon submission.
...(...)...
17.01.2016, 19:32
Quelle: https://www.phpbb.com/styles/ssp/
genannt. :wink:


Gruß

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 18.01.2016 13:56
von Klaus 1412
unicorn75 hat geschrieben:...
Vielleicht ne dumme frage aber trotzdem ^^ Spielt die Reihenfolge der css Anweisungen innerhalb der colours.css eine rolle?
...
Wenn ich den Forenhintergrund mit einem Farbverlauf versehen will, reicht dann "background" oder muss ich "background-image" nutzen? ...
Die Reihenfolge ist entscheidend. Eine nachfolgende Anweisung ersetzt eine Vorherige.
Genau das ist ja das Problem bei dem Stylesheet des Forums. Eine einzige Klassendefinition ist im ungünstigsten Fall in mehreren Dateien, also nicht nur in der colours.css, zu finden - genau das macht es verwirrend.

Also einfach mal bei Firebug im rechten Fenster (das mit den CSS-Anweisungen) nachschauen. Die oberste Anweisung ist die letzte Anweisung, die verwendet wird. Alle Anweisungen darunter, die durchgestrichen sind, wurden überschrieben und können genau genommen sogar ganz entfallen. In den Blöcken steht auch drin, in welcher Datei und Zeile sich diese Anweisung befindet. - Weiterhin - wenn hier etwas fehlt, also beispielsweise eine andere Schriftfarbe, fügt man diesen neuen Parameter einfach in der Anweisung, die an der obersten Stelle steht, mit ein.

Das Schöne ist ja, dass man so eine Änderung in Firebug direkt testen und sehen kann, bevor man in der css-Datei etwas ändert. :geek:
Aber Vorsicht, durch die unübersichtliche Verschachtelung und Kombination mehrerer Stile, kann sich so eine Änderung auch an einer anderen Stelle auswirken.

Die Frage mit 'background' oder 'background-image' ist relativ einfach zu beantworten: bei 'background-image' wird nur auf das Bild verwiesen. Bei 'background' kann auch auf das Bild verwiesen werden, d.h. 'background' ist die universelle Anweisung, in der die Farbe, das Bild, die Wiederholung usw. zusammen angegeben werden kann.

Re: Tool zum Nachverfolgen von CSS Code

Verfasst: 18.01.2016 15:50
von unicorn75
Klaus 1412 hat geschrieben:
unicorn75 hat geschrieben:...
Vielleicht ne dumme frage aber trotzdem ^^ Spielt die Reihenfolge der css Anweisungen innerhalb der colours.css eine rolle?
...
Wenn ich den Forenhintergrund mit einem Farbverlauf versehen will, reicht dann "background" oder muss ich "background-image" nutzen? ...
Die Reihenfolge ist entscheidend. Eine nachfolgende Anweisung ersetzt eine Vorherige. ....Genau das ist ja das Problem bei dem Stylesheet des Forums. ...... Die oberste Anweisung ist die letzte Anweisung, die verwendet wird.

Das Schöne ist ja, dass man so eine Änderung in Firebug direkt testen und sehen kann, bevor man in der css-Datei etwas ändert. :geek:

Die Frage mit 'background' oder 'background-image' ist relativ einfach zu beantworten: bei 'background-image' wird nur auf das Bild verwiesen. Bei 'background' kann auch auf das Bild verwiesen werden, d.h. 'background' ist die universelle Anweisung, in der die Farbe, das Bild, die Wiederholung usw. zusammen angegeben werden kann.
Ok also mal lieber nicht in der css aufräumen und ordnen ^^
Ja eben bei firebug gesehen - schön, da kann man frei "rumschrauben"'
also bleibe ich gleich bei background

Talk19zehn hat geschrieben:Hi, das sind nur wenige Seiten; Sehr schön siehst du hier, was man u.U. momentan für Farbverläufe braucht, nutzt: http://www.colorzilla.com/gradient-editor/
....
Im Grunde kann man sich am QT von phpBB selbst orientieren.

Gruß
Ja ich hatte den code für die farbverläufe direkt aus dem prosilverstyle genommen und nur auf der seite verglichen, einzig eine zeile für älteren IE beigefügt