Hier im Forum bekommt ihr bei euren fragen schnelle hilfe.Hier geht es rund um das Web SeitenProgrammieren.Alles rund ums Javascript,Html,Php,Css und Sql.Auf fast allen Fragen haben wir eine Antwort.
Der Soforthilfe-chat verspricht das ,was sein Name sagt. Hier sind Leute Online die sofort ihre hilfe anbieten.Seht in der OnlineListe nach und wenn einer Online ist werdet ihr auch antwort bekommen. Admine ,Moderatoren und Helfer sind unsere Spezialisten in Sachen Web Programierung
71 Unwetterwarnungen in Deutschland
Die Datenbank wurde zuletzt am 02.08.2020 17:34:28 aktualiesiert
71

Wieso sollte man kein inline CSS/JS verwenden

Es gilt als schlechter Stil inline CSS zu verwenden:

<span style="color: #666666; display: block; float:left; width: 250px;padding-bottom:5px;">

d.h. das CSS eines Elements direkt über das style Attribut zu aktivieren.

Dasselbe gilt auch für Inline Javascript:

<div></div>
<script type="text/javascript">
    alert("hallo");
</script>

Folgende Gründe gibt es dafür:

Wartbarkeit

Bei Änderungen (durch andere) schaut man erst mit Firebug auf das Element und es findet sich keine Zeile in einer Datei im Code, wo man seine Änderungen einpflegen kann. Normalerweise würde im Firebug die CSS Datei und die Zeile stehen. Man muss das Modul oder die inkludierte PHP aufwendig suchen um Änderungen vorzunehmen. Das kostet viel Zeit im Nachgang.

Wieso man kein Inline CSS verwendet: Wartbarkeit

Es erschwert auch das Redesign von Projekten, die ein neues Frontend bekommen sollen, weil verschiedenste Dateien und CSS Quellen geändert werden müssen, anstatt die CSS Datei zu ändern.

Caching von CSS Dateien

CSS/JS Dateien werden vom Browser gecacht und müssen nicht bei jeder Unterseite neu geladen werden (selbes gilt auch für). Wenn der Code nicht ausgelagert ist, wird die zu übertragenden Menge an Daten größer um das inline CSS/JS welches ausgelagert werden hätte können.

Übersichtlchkeit

Vertikal ist viel übersichtlicher als horizontal:

<span style="color: #666666; display: block; float:left; width: 250px;padding-bottom:5px;">

oder

<span clas="myclass">

und im CSS:

.myclass
{
   color: #666666;
   display: block;
   float:left;
   width: 250px;
   padding-bottom:5px;
}

Ein Nebeneffekt ist, dass Änderungen mit SVN zeilenweise besser nachvollziehbar sind.

IDE Darstellung

Viele IDEs finden keine Fehler im inline CSS oder stellen weniger Informationen dar, als wenn Code in .css oder .js Dateien gespeichert werden. Es gibt bei manchen auch keine Code-Vervollständigung/Fehlerkorrektur im inline CSS.

Erweiterte Optionen in der IDE und SVN: Farben (siehe graues Viereck links) und zeilenweise Änderungen werden

Doppelter Code

Inline definierte Styles lassen sich auch nicht wiederverwenden, indem man einfach die Klasse an ein anderes Element packt. So werden Änderungen auch aufwendiger, da Sie an jedem Element durchgeführt werden müssen.