如何用DIV+CSS让导航的背景自适应浏览器宽度。见图片。

2024-11-05 21:52:25
推荐回答(5个)
回答1:

一般的 简单的方法是设置导航容器宽度为百分比数值
利用背景图片自动横向重叠的方法来做
-----------
按照楼主说的图片不用背景图片的方式,那就要用前景图片,那你导航文字还要用绝对定位到图片上??
这样这个导航就搞的太复杂了...
不用背景图片也不用前景图片的话就用H5的canvas绘图吧....更加复杂了 低版本浏览器兼容性也不好
不知道楼主你想咋样了

回答2:

一般都是做背景居中,也一样可以适应。
你一定要图片宽度跟着浏览器宽度变化的话,html和body设置为100%,底下垫一层div,宽度设置100%,插入图片宽度设置100%,就可以了。
-----补充
红色菜单不用图片,只用css是可以实现的,使用border来画红色三角形部分,就解决了,不需要使用canvas。

红色菜单的定位的问题,可以使用flex,不过在老浏览器里兼容性不好,这个设计好像没有其他很好的解决办法,只能用flex。

回答3:

在html里面插入一个图片标签,设置这个图片的css,
position:absolute;//绝对位置
top:0;
left:0;
right:0
;z-index:-1;//置于最下层,
红色的导航普通写就可以了。

回答4:

你可以设置百分之百的宽度,或者是横向平铺

回答5: