否则需要将其作为网页背景的话可以试试如下方法:
2、如果这张图片为背景图片由于背景图片不具有伸缩性,只能通过别的方法绕着解决,在ie中可以用<body
style="filter:progid:dximagetransform.microsoft.alphaimageloader(src='1.jpg',sizingmethod='scale')">,实现背景拉伸铺满整个浏览器,但其它的浏览器不支持。
这时可以拐个弯,设置两层div,底层div当做背景使用,放置一张图片即可。
<div id="background" style="position:absolutez-index:-1width:100%height:100%top:0pxleft:0px"><img src="1.jpg" width="100%" height="100%"/></div>
再将网页内容放置到第二层上<div id="content">页面内容</content>
3、网页背景图片默认情况下是重复平铺满整个页面。上面2方法是要求图片不重复,但又得占满浏览器所采用的方法。
想要使用CSS将div元素的内容分成多列来显示,可以使用columns属性。columns属性一个简写属性,可以设置列数和列宽,用于设置分栏模块。下面本篇文章就来给大家介绍一下columns属性,希望对大家有所帮助。
columns 属性是一个简写属性,一次可以采用多个值;用于设置列宽和列数。
语法:
属性值:
● auto: 这会将列宽和列计数值设置为其浏览器默认值。
示例:
效果图:
注意:如果未指定column-width和column-count中的任何值,则浏览器默认将其值设置为auto。
● column-width和columns-count :用于使用整数值指定列宽和列数。
效果图:
浏览器支持:
● Chrome 50.0, 4.0 -webkit-
● Edge 10.0
● Firefox 52.0, 9.0 -moz-
● Safari 9.0, 3.1 -webkit-
● Opera 37.0, 15.0 -webkit- 11.1