[分享]css3改变照片样式

CSS3是一种用于前端网页设计的语言，它可以增强网页的样式和表现力。使用CSS3，我们可以很方便地改变照片的样式，使得照片更加美观和有吸引力。下面介绍几种常用的照片样式：圆角矩形：img { bord...

CSS3是一种用于前端网页设计的语言，它可以增强网页的样式和表现力。使用CSS3，我们可以很方便地改变照片的样式，使得照片更加美观和有吸引力。下面介绍几种常用的照片样式：

圆角矩形：

img {
    border-radius: 10px;
} 

这个代码可以使得照片变为圆角矩形，如果想要更加圆滑的边角，可以将10px改为更大的数值。

投影：

img {
    box-shadow: 3px 3px 5px #888888;
} 

这个代码可以给照片添加投影效果，3px和5px分别表示水平和垂直阴影的偏移量，#888888表示阴影的颜色。

浮动：

img {
    float: left;
    margin-right: 20px;
} 

这个代码可以让照片向左浮动，并且在右侧留出20px的空白间隔。

放大：

img:hover {
    transform: scale(1.2);
} 

这个代码可以让鼠标悬停在照片上时，照片放大到原来的1.2倍。

除了上述几种样式，CSS3还有很多其他的样式可以用来美化照片，大家可以自己尝试一下。