I have an image attached below for which I want to write css that will provide border to the image from left & bottom. I tried but my code is taking full border
This is the required output that I want.
img{ border-top: 15px solid #faa633; border-right: 15px solid #faa633; border-left: 15px solid #faa633; }
<img src="https://images.unsplash.com/photo-1494548162494-384bba4ab999?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80" style="height: 400px;width: 300px">
keep the border transparent and apply a gradient with a specific size:
img { border: 15px solid transparent; background: linear-gradient(#faa633, #faa633) bottom left/ /* position */ 50% 40% /* width height */ border-box no-repeat; }
<img src="https://picsum.photos/id/10/200/150" >
如果您只希望图像的两侧有边框,我建议使用 box-shadow。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.