Heim > php教程 > PHP开发 > Hauptteil

Der Unterschied zwischen Bildpfaden in CSS und Javascript

高洛峰
Freigeben: 2016-12-01 15:59:06
Original
1546 Leute haben es durchsucht

Als ich heute Code eingegeben habe, wollte ich eine Funktion zum Wechseln von Avataren schreiben, aber hier kommt das Problem: Der Avatar wird einfach nicht angezeigt. Plötzlich hatte ich eine Idee, dass die Art und Weise, Bildpfade in CSS und JavaScript zu schreiben, unterschiedlich ist. ? ?

Hmm... Es ist so:

Eine neue „Bilder“-Datei im Stammverzeichnis erstellt und zwei Bilder bg1.png und bg2.png darin abgelegt

Zwei zusätzliche Ordner „style“ und „script“ werden im Stammverzeichnis erstellt, um die verwendeten .css-Dateien und .js-Dateien zu speichern.

index.html enthält

<div id="pic">
<p>开心吗</p>
</div>
Nach dem Login kopieren

Wenn ich möchte Um den Bildhintergrund des Tags mit der ID von pic festzulegen, würde ich Folgendes in die CSS-Datei schreiben:

#pic{ background:url(../images/bg1.png); }
Nach dem Login kopieren

, und in die JS-Datei würde ich den Pfad als images/bg1.png schreiben

Kurz gesagt:

(1) Bei JS-Skripten besteht HTML darin, das Skript in die Seite zu laden und zusammen zu analysieren (genau wie Ihr JS-Skript direkt auf dieser Seite geschrieben ist)

(2) Für CSS-Dateien wird nur ein Link bereitgestellt und nicht in die HTML-Seite geladen. In diesem Beispiel sucht HTML beispielsweise anhand des Links nach der erforderlichen Bilddatei in der CSS-Datei.

Der Bilddateipfad von CSS ist relativ zu sich selbst, und der Bilddateipfad von JS ist relativ zu der Datei, in der er sich befindet.


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage