CSS如何设置本地图片作为网页背景？ html里怎么插入背景图片？？急
css\u600e\u4e48\u8c03\u6574\u80cc\u666f\u56fe\u7247\u7684\u4f4d\u7f6e\uff1f1\u3001\u9996\u5148\u6253\u5f00\u524d\u7aef\u5f00\u53d1\u5de5\u5177\uff0c\u65b0\u5efa\u4e00\u4e2ahtml\u4ee3\u7801\u9875\u9762\u3002
2\u3001\u5728html\u4ee3\u7801\u9875\u9762\u4e0a\u521b\u5efa\u4e00\u4e2a\u7528\u4e8e\u8bbe\u7f6e\u80cc\u666f\u989c\u8272\u7684div\u6807\u7b7e\uff0c\u7136\u540e\u7ed9\u8fd9\u4e2a\u6807\u7b7e\u6dfb\u52a0\u4e0aclass = "bg-img"\u3002
3\u3001\u8bbe\u7f6e\u80cc\u666f\u56fe\u7247\u3002\u521b\u5efastyle\u6807\u7b7e\uff0c\u7136\u540e\u5728\u6807\u7b7e\u91cc\u9762\u5bf9\u7c7b\u4e3abg-img\u8bbe\u7f6e\u80cc\u666f\u56fe\u7247\u3001\u56fe\u7247\u4e0d\u91cd\u590d\u3001\u5bbd\u3001\u9ad8\u7684\u6837\u5f0f\u3002
4\u3001\u4fdd\u5b58html\u4ee3\u7801\uff0c\u4f7f\u7528\u6d4f\u89c8\u5668\u6253\u5f00\uff0c\u8fd9\u4e2a\u65f6\u5019\u4f1a\u53d1\u73b0\u6d4f\u89c8\u5668\u4e0a\u7684\u80cc\u666f\u56fe\u7247\u663e\u793a\u5728\u5de6\u4e0a\u89d2\u3002
5\u3001\u56de\u5230html\u4ee3\u7801\u9875\u9762\uff0c\u5728bg-img\u7c7b\u91cc\u6dfb\u52a0background-position: center\u7684\u5c5e\u6027\u3002
6\u3001\u4fdd\u5b58html\u4ee3\u7801\u540e\u91cd\u65b0\u5237\u65b0\u6d4f\u89c8\u5668\uff0c\u8fd9\u4e2a\u65f6\u5019\u4f1a\u53d1\u73b0\u6d4f\u89c8\u5668\u4e0a\u7684\u80cc\u666f\u56fe\u7247\u5df2\u7ecf\u81ea\u52a8\u5c45\u4e2d\u4e86\u3002
1\u3001\u63d2\u5165\u80cc\u666f\u56fe\u7247\u6709\u4e24\u79cd\u65b9\u6cd5\uff0c\u4e00\u79cd\u662f\u7528html\u7684img\u6807\u7b7e\uff0c\u53e6\u4e00\u79cd\u662f\u5229\u7528css\u7684background\u6807\u7b7e\u63d2\u5165\u3002\u5177\u4f53\u64cd\u4f5c\u662f\u9996\u5148\u65b0\u5efa\u4e00\u4e2ahtml\u6587\u4ef6\uff0c\u5199\u5165\u4e24\u4e2adiv\uff0c\u5206\u522b\u7528\u6765\u6f14\u793a\u4e24\u79cd\u65b9\u6cd5\u63d2\u5165\u6807\u7b7e\uff1a
2\u3001\u9996\u5148\u662f\u7528html\u6807\u7b7e\u63d2\u5165\u56fe\u7247\uff0c\u8fd9\u91cc\u76f4\u63a5\u5728img\u6807\u7b7e\u4e2d\u4f7f\u7528src\u5c5e\u6027\u5c31\u53ef\u4ee5\u63d2\u5165\u56fe\u7247\u8def\u5f84\u5c31\u6210\u529f\u4e86\uff1a
3\u3001\u63a5\u7740\u662f\u7528css\u63d2\u5165\uff0c\u5728div\u4e2d\u8bbe\u7f6eclass\u5c5e\u6027\u4e3aimg2\uff0c\u5728script\u6807\u7b7e\u4e2d\u4f7f\u7528background\u6807\u7b7e\u63d2\u5165\uff0c\u5176\u4e2durl\u662f\u6807\u7b7e\u7684\u8def\u5f84\uff0cno-repeat\u662f\u8bbe\u7f6e\u56fe\u7247\u4e0d\u91cd\u590d\uff0ccenter\u662f\u8bbe\u7f6e\u7167\u7247\u5c45\u4e2d\u663e\u793a\uff1a
4\u3001\u6700\u540e\u7ed9\u8fd9\u4e9b\u6807\u7b7e\u90fd\u8bbe\u7f6e\u4e00\u4e9b\u6837\u5f0f\uff0c\u8ba9\u5b83\u4eec\u663e\u5f97\u7f8e\u89c2\u4e00\u4e9b\u3002\u7136\u540e\u6253\u5f00\u6d4f\u89c8\u5668\u67e5\u770b\u6548\u679c\uff1a
5\u3001\u6253\u5f00\u6d4f\u89c8\u5668\uff0c\u53ef\u4ee5\u770b\u5230\u7167\u7247\u90fd\u663e\u793a\u51fa\u6765\u4e86\u3002\u4ee5\u4e0a\u5c31\u662fhtml\u63d2\u5165\u7167\u7247\u7684\u65b9\u6cd5\u4ecb\u7ecd\uff1a
，用浏览器打开，然后把地址复制
进入，如果你要用先对路径那么你的页面和图片要在同一个项目才行，就是同一个大的文件夹下。不然你就用绝对路径
绝对路径就是
盘符;//文件夹/文件名.后缀
绛旓細css璁剧疆鍥剧墖浠ｇ爜锛氫篃灏辨槸璇村湪css涓粰缃戦〉涓坊鍔犺儗鏅浘鐗囷細 .bjimg{ width:200px; height:200px; background:url(鍥剧墖瀛樻斁璺緞) no-repeat;} 璁茶В锛氬洜涓烘槸鍦css涓缃浘鐗锛屾墍浠ヨ捣涓涓猚ss鏍峰紡鍚嶄负bjimg锛屽湪div涓紩鍏ワ紱寤虹珛姝ss瀹藉害(width)锛200px锛岄珮搴︼紙height锛200px; background:url鏄紩...
绛旓細鎴戜滑鍦╰hml,鍒涘缓涓涓猟iv.骞跺皢杩欎釜div鐨勮儗鏅璁剧疆涓鍥剧墖锛屽綋鐒讹紝濡傛灉鎮ㄩ渶瑕佸皢鍥剧墖浣滀负鏁翠釜椤甸潰鐨勮儗鏅紝浠ヤ笅姝ラ涔熷悓鏍烽傜敤涓庢偍銆傚湪涓婂浘涓紝鏈夊嚑涓猟iv锛屾垜浠互id涓篸1鐨刣iv涓轰緥銆傚垱寤轰簡div鍚庯紝鎴戜滑闇瑕佷负div娣诲姞鏍峰紡銆傛坊鍔犳牱寮忔垜浠叏閮ㄥ啓鍦CSS鏂囦欢涓紝骞跺湪html椤甸潰涓紩鐢ㄣ傚叿浣撶殑鏍峰紡鍏ヤ笅鍥炬墍绀猴細鎴戜滑棣栧厛...
绛旓細璁剧疆鐖跺眰涓簆osition:relative;璁剧疆璇鍥剧墖鎵鍦ㄧ殑灞俻osition:absolute;渚嬶細<!--鐖跺眰寮濮--> <!--鍥剧墖灞傚紑濮--> <!--鍥剧墖灞傜粨鏉--> <!--鐖跺眰缁撴潫-->
绛旓細body 涓 background: #ececec; 锛屾敼鎴 background:url锛堣儗鏅鍥剧墖璺緞锛夛紱杩欐牱灏卞彲浠ュ湪椤甸潰涓彃鍏ヨ儗鏅傚叾浠栧湴鏂规坊鍔犺儗鏅篃鏄噰鐢ㄨ繖鏍风殑鍋氭硶銆
绛旓細闇瑕佸噯澶囩殑鏉愭枡鍒嗗埆鏈夛細鐢佃剳銆佹祻瑙堝櫒銆乭tml缂栬緫鍣ㄣ1銆侀鍏堬紝鎵撳紑html缂栬緫鍣紝鏂板缓html鏂囦欢锛屼緥濡傦細index.html銆2銆佸湪index.html涓殑鏍囩涓紝杈撳叆css浠ｇ爜锛歩mg {position: absolute;top: 100px; left: 200px;}銆3銆佹祻瑙堝櫒杩愯index.html椤甸潰锛屾鏃堕氳繃css瀹炵幇浜鍥剧墖鐨勭粷瀵瑰畾浣嶏紝璺濈宸︿晶100px锛岄《閮200...
绛旓細鐢CSS鏍峰紡琛ㄥ湪缃戦〉涓璁剧疆鍥剧墖浣嶇疆锛岄鍏堬紝涓鑸兘鏄皢鍥剧墖鍖呰９鍒颁竴涓猟iv涓紝鐒跺悗鍦璁惧畾涓涓埗绾у厓绱狅紝涓鑸兘鏄洿鎺ラ夋嫨娴忚鍣紝鐪嬪叿浣撹姹傛潵锛屽湪浣跨敤position鐨勫畾浣嶆潵鍋氾紝濡俻osition:absoulte; left:10px; top:10px;鎰忔濆氨鏄窛宸﹁竟10涓猵x锛岃窛绂讳笂杈10px;杩欓噷閫氳繃浠ｇ爜鏉ョ悊瑙ｄ笅锛 div1{ //閫氳繃id...
绛旓細鎿嶄綔鏂规硶濡備笅锛1銆佷互Hbuilder鏉ヨ瑙ｏ紝棣栧厛鏂板缓涓涓狧TML椤甸潰锛屽鍥撅紱2銆佹帴鐫缁欐爣绛璁剧疆鑳屾櫙鍥剧墖锛屽鍥捐缃殑鏄爣绛撅紱3銆佺劧鍚庢柊寤轰竴涓css鏂囦欢锛屽鍥撅紱4銆佽繖閲岀粰body鏍囩璁剧疆background-size灞炴э紝濡傛灉鏍囩鏄痙iv灏卞啓div锛岀劧鍚庡彲浠ヨ缃搴﹀拰楂樺害锛5銆佸鍥炬墍绀猴紝鍦╪ew_file.html閲岄潰缂栬緫锛氾紝灏卞彲浠ヨ缃儗鏅浘鐗...
绛旓細鏈2绉嶆柟娉曪紝1锛孉鏍囩锛 瑕佹敞鎰忕殑鏄疉鏍囩鏄竴涓唴鑱斿厓绱狅紝瑕乨isplay:block锛涘彉鎴愬潡鐘讹紝浣璁剧疆鐨勯珮瀹芥墠鏈夋晥銆2锛孞avaScript, window.location.href="鍦板潃"
绛旓細3銆佸湪test.html鏂囦欢涓紝鍦╬鏍囩鍐咃紝浣跨敤p鏍囩鍒涘缓涓娈垫枃瀛楋紝涓嬮潰灏嗛氳繃css璁╄娈垫枃瀛楁坊鍔犲湪鍥剧墖4銆佸湪test.html鏂囦欢涓紝鍦╟ss鏍囩涓紝閫氳繃鈥*鈥濇潵鍒濆鍖椤甸潰鎵鏈夊厓绱犲唴澶栬竟璺涓0锛岄伩鍏嶅奖鍝嶄笅闈ss鏍峰紡瀹氫箟銆5銆佸湪css鏍囩涓紝瀵筽鍏冪礌杩涜鏍峰紡璁剧疆锛屽畾涔夊叾浣嶇疆灞炴osition涓虹浉瀵瑰畾浣嶏紙relative锛夈6銆佸湪css...
绛旓細杩欎釜闇瑕佺敤css鏉璁剧疆
