communauté Apprendre Bibliothèque d'outils Loisirs
recherche
Français
Maison > php教程 > PHP开发 > css和javascript中图片路径的不同

css和javascript中图片路径的不同

高洛峰
Libérer： 2016-12-01 15:59:06
original
1575 Les gens l'ont consulté

今天敲代码时，想写一个切换头像的功能，问题来了，头像就是死活不出现呐。突然灵光一现，难道css和javascript中图片路径书写方式不一样？？？

嗯…是这样的:

在根目录下新建了个“images”文件，里面放了两张图片bg1.png和bg2.png

在根目录下另外新建了两个文件夹"style"和"script"用来存放用到的.css文件和.js文件

index.html中有

<div id="pic">
<p>开心吗</p>
</div>
Copier après la connexion

如果这时我要设置id为pic的标签的图片背景,在css文件里这样写:

#pic{ background:url(../images/bg1.png); }
Copier après la connexion

而在js文件中则要将路径写做images/bg1.png

总之，

(1)对于js脚本,html是吧脚本加载到页面中一起解析(就跟你的js脚本直接写在这个页面是一样的)

(2)而对css文件,则仅仅是提供一个连接,并不会将其加载到html页面中,如在本例中,html根据链接去css文件中寻找所需要的图片文件。

css的图片文件路径是相对于自己的，js的图片文件路径是相对于所在文件的。


Étiquettes associées：
css javascript
source：php.cn
Article précédent：Linux内核配置、编译及Makefile简述 Article suivant：Nginx 服务器 之Nginx与tomcat实现负载均衡
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Où sont les didacticiels sur la cartographie mentale CSS ? Didacticiel
Depuis 2024-04-16 10:10:18
0
0
1335
La page ne peut soudainement plus extraire le CSS ou le bootstrap Je suis donc en train de développer une page, j'en ai fait une partie hier et ça a très bi...
Depuis 2024-04-06 21:58:04
0
1
800
Modifier dynamiquement les styles CSS en ligne dans Javafx J'essaie de changer l'image d'arrière-plan d'un volet lorsque l'application est agrandie. ...
Depuis 2024-04-06 20:57:16
0
1
487
Comment empiler les éléments flottants verticalement plutôt qu'horizontalement en CSS ? J'essaie de créer une page Web avec deux colonnes, avec le contenu principal d'un côté et ...
Depuis 2024-04-06 20:45:26
0
2
386
Existe-t-il un moyen de forcer le texte de la flexbox à être centré verticalement, quel que soit l'autre code CSS dont nous disposons ? J'ai le code CSS suivant qui fait partie d'un code CSS plus vaste utilisé dans un site Web...
Depuis 2024-04-06 20:41:51
0
1
518
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal