I have a image which I want to crop and then use it accordingly for my project using html/css. I don't want to use any photo editor.
2 Answers
here's an example:
<div id="test">
<img id="image" src="LINK to Image">
</div>
and for CSS:
#test{
overflow: hidden;
height: (number)px;
width: (number)px;
}
#image{
position: relative;
top: (number)px;
left: (number)px;
}
so the (position: relative) of the image will allow you to move it with top and left in relation to the div. The height and width of the div will be the crop area.
Hope this helps
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}