css问题!如何提取图片中的一部分

html-css013

css问题!如何提取图片中的一部分,第1张

用绝对定位..

background-position: -186px -22px 定位背景的具体位置..

比如你这个整体图, 是一张背景 , 你就可以通过 background-position:XX

来定位 这个张背景图的具体显示那块内容.. 可以去试试..网上很多素材

光靠字面理解很难,最好自己动手实践

方法一:

<div style="width:600pxheight:200pxbackground:url(路径图片中间部分切成1px宽) repeat-x">

<img src="路径图片左圆角" style="float:left"/>

<img src="路径图片右圆角" style="float:right"/>

</div>

方法二:

<div style="width:600pxheight:200pxbackground:url(图片中间部分切成1px宽)">

<div style="background:url(路径图片左圆角) no-repeatfloat:leftwidth:左圆角宽pxheight:左圆角高px">

<div style="background:url(路径图片右圆角) no-repeatfloat:rightwidth:右圆角宽pxheight:右圆角高px">

</div>

注:切图时,圆角图片一定要连着圆角外的白色部分一起切,中间填充部分可以只切1px宽,实际高度进行填充

在图片的外围加一个div框,然后通过这个框进行加宽高,然后用overflow:hidden来隐藏图片多余的部分。像现在很流行的圆形头像,其实图片是一张四方或者长方的图片。

然后通过对包住div的css加:border-radius:50%overflow:hidden就可以显示为圆形的图片了。关于这个是最方便的。也可以用这个方法解决图片的裁切问题。

希望我的解答可以帮到你,有什么不懂可以追问。