css中怎样把全屏图片缩小

在网页设计中，全屏图片的应用非常普遍，但是有时候我们需要把这些图片缩小一下，以适应网页的布局。下面就介绍一下如何通过CSS来实现全屏图片的缩小。
首先，在网页中插入一张全屏图片，可以通过以下代码实现：

<img src="imagename.jpg" style="width:100%; height:100%;"> 

其中，style属性中的width和height设置为100%，这样就可以让图片占据整个浏览器窗口。接下来，我们需要对这张图片进行缩小，可以通过以下CSS代码实现：

img{
    max-width: 50%;
    height: auto;
} 

其中，max-width属性设置为50%，表示图片最大宽度为浏览器窗口的50%，而高度则根据宽度缩放自适应。这样就可以让全屏图片缩小到合适的尺寸。
有时候，我们需要在全屏背景下放置一些内容，此时需要使用CSS的定位属性来实现。以下是一个简单的示例：

body{
    background-image: url('imagename.jpg');
    background-size: cover;
    background-position: center;
}

.content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
} 

其中，body的背景设置为全屏图片，并且使用cover属性让图片铺满整个屏幕；content部分设置为绝对定位，让其居中对齐。
总之，通过CSS的样式控制，我们可以轻松地将全屏图片缩小到合适的尺寸，并在其上添加其他内容。