css定位图片位置不变的实现方法:首先创建一个HTML示例文件;然后引入一个background背景图片;最后给该图片添加“position: fixed”样式即可固定图片位置并保持不变。
本教程操作环境:windows7系统、css3版,该方法适用于所有品牌电脑。
:《css视频教程》
在css中,可以使用固定定位(position: fixed)来定位图片保持图片位置不变,让图片位置可以不随着文字的拖动而改变图片位置。
position: fixed用于生成固定定位的元素,相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
fixed 生成固定定位元素,元素脱离文档流,不占据文档流的位置,可以理解为漂浮在文档流的上方,相对于浏览器窗口进行定位。
固定定位(position:fixed):元素以相对浏览器窗口为基准进行定位的,无论怎样移动你的滑动条,它都会固定在相对于浏览器窗口的固定位置,另外要注意,它的兄弟元素将会在位置排布上忽视它的存在。这个时候用的top,bottom,left,right也是相对于浏览器窗口而言的。
示例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style type="text/css"> .logo { width: 540px; height: 258px; position: fixed; background: url(
效果图:
说明:
从上面的示例看出:可以使用position: fixed来固定图片位置不变,让图片位置可以不随着文字的拖动而改变图片位置。
消息,欧洲证券和市场管理局警告称,欧盟内提供的预测市场合约可能已符合现有金融规则,...
2 CZ:Michael Saylor对比特币行业的积极影响消息,CZ表示,Michael Saylor对比特币行业绝对是一个净积极因素,称其为声誉良好的比特币死忠...
3 比特币多头头寸仍占主导,清算潜力达消息,分析师指出,1个月的清算水平显示出有趣的现象。尽管短期内空头头寸已被清算,但多...
4 哥伦比亚总统佩特罗:特朗普此前消息,哥伦比亚总统佩特罗:特朗普此前并不知道我被列入美国财政部海外资产控制办公室制...
5 沙特若进一步发动袭击消息,也门胡塞武装:沙特若进一步发动袭击,将遭到针对沙特机场及重要利益目标的打击。...
6 巴基斯坦与特朗普家族加密项目签署谅解巴基斯坦今年1月与特朗普家族加密项目World Liberty Financial关联方SC Financial Technologies签署谅解备...
7 美股大赢家:INTC多单平仓割肉,持仓规模消息,波段交易员在INTC多单上已完全平仓,平仓前持仓规模为3,278,776.64美元。该交易员资金体...
8 美股大赢家:DRAM空单增持13021.30枚,当前消息,DRAM空单增持13,021.30枚,约合820,922.86美元,持仓规模为5,852,854.21美元,均价为64.84美元,...
9 2026年上半年约70个加密项目关闭或申请破2026年上半年约70个加密项目关闭、申请破产、宣布停止运营或被归为不活跃,涉及DEFI、NFT、链...
10 以军称在黎南部打击约10处真主党设施消息,当地时间3日,以色列国防军发表声明称,针对黎巴嫩真主党所谓持续违反停火协议并袭...
成都来彰科技 蜀ICP备2025134723号-1
资讯来源互联网,如有版权问题请联系管理员删除。