Dreamweaver CS6如何应用:[30]设置URL路径
1、相对路径是指相对于某文件本身所在位置的路径。例如,厢咆廨炝某CSS文件和图片1.jpg处在服务器的同一目录下,当通过CSS调用此图片时,可以使用如下代码实现: body{ background: URL (1.jpg); }
2、绝对路径是指某应用对象放在网络空间中的绝对位置,是它实际的存放位置。例如,如下代码通过绝对路径来设置某图片为背景图片。 body{ background:URL(http://www.sin锾攒揉敫a.com/news/guoji/1.jpg); }
3、具体操作如下:新建一个HTML空白页
4、点击CSS控制面板新建CSS规则,在弹出的对话框选择器中选择‘类’,名称为‘aaa'
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/bd72f23834bb19efb74149a7497bd28287893ab1.jpg)
5、在弹出的’。aaa的CSS规则定义‘对话框中,在分类栏选择’方框‘选项,设置’宽‘为400像素,高为200像素,
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/a007a9b1eef97fbd52627100b74133bad24133b1.jpg)
6、在分类栏选择’背景‘,在’背景图片选择已经准备好的,存在站点里的图片
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/023cff37c97622bc5adb8ad4a05fd546049628b1.jpg)
7、另外新建一个新的CSS规则,命名为‘bbb'
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/04d7a614f4d0b503e7cc034dcc4ec28332bf20b1.jpg)
8、设置方框的宽400像素,高200像素,
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/47bf594ec28333bf0ff170fcdbb8b43ea9db1db1.jpg)
9、在’背景‘的’背景图像‘中黏贴进网页图片的地址,具体的地址可以右击,会出现’复制图片地址选项,如下:
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/32fe25ef354f50b88320ed68dc4afa32929c18b1.jpg)
10、黏贴进去之后,点击确定
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/560be432939c2cf7e2ac99aa452c5b1b1fde12b1.jpg)
11、在菜单栏选择‘插入’----‘布局元素’---‘div标签',在弹出的’插入div‘对话框中,类的选择为’aaa'
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/def3c219ce2c5b1b5fc0b16f2b39131fcfec0eb1.jpg)
12、效果如下:
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/5a5a00def4dca03957018b5f58d96975f3c40db1.jpg)
13、再插入一个DIV标签,选择‘在结束标签之前‘插入,类选择’bbb'
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/cfadcdd96975f2c4a5871cf08f0148fe1f4206b1.jpg)
14、效果如下:
![Dreamweaver CS6如何应用:[30]设置URL路径](https://exp-picture.cdn.bcebos.com/054056fe1e425d6b4bcf0c9a11883913e9e500b1.jpg)
15、这两张图片的区别在于,第一张图片,即类名为aaa的图像地址在本地站点,类名为bbb的图片地址在网络上面,所以链接的路径不同