如何在HTML中用CSS对图片进行缩放

html-css013

如何在HTML中用CSS对图片进行缩放,第1张

可以用css3中“transform: scale()”属性对图片进行缩放。

1、新建html文档，在body标签中添加一张图片，给这张图片设置css属性，添加“tansform”缩放属性，属性值为“scaleX(n)”，scaleX(n)指的是对宽度进行缩放，n指的是缩放比例：

2、将transform的属性值改为“scaleY(n)”，scaleY(n)指的是对高度进行缩放，n指的是缩放比例：

3、将transform的属性值改为“scale(n)”，scale(n)指的是对图片的宽度和高度同时进行等比例缩放，n指的是缩放比例：

给a标签设置display:block后，它会根据盒模型计算a标签的实际大小。

这时候，你可以使用hover伪类使a的整个盒模型生效。

.link a{display:blockpadding:2px 10px}

/*这样，a标签的范围就是文字上下各扩出2px左右各扩出10px/*

然后

.link a:hover{background:#newcolor}

就能实现你要的效果。

你所说的不要点击效果，要记住lovehate的前后顺序，以及各自代表的意义。

hover即onmouse的效果，active是点击效果。