Heim > Web-Frontend > HTML-Tutorial > 求救div圆角问题_html/css_WEB-ITnose

求救div圆角问题_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:18:20
Original
1247 Leute haben es durchsucht

现在有左上、右上、左下、右下 四张圆角切图。
怎么把div背景颜色设置成圆角啊?就是怎么把四张图片放到div的四个角上?求救?


回复讨论(解决方案)

demo this here

<div class="box"> <div class="box-outer">    <div class="box-inner">        <p>sdfsdffffddsfdf</p>    </div><div><div>.box{background:url(左下) no-repeat left bottom}.box-outer{background:url(右下)no-repeat right bottom;}.box-inner{background:url(左上) no-repeat  left top;}p{background:url(右上) no-repeat right top;}
Nach dem Login kopieren

图片具体位置可以利用padding的四个方位值调节一下 

CSS code?1234567891011121314151617181920

 
    
        

sdfsdffffddsfdf

    
 .box{background:url(左下) no-r……

大侠?在?

现在每个角都是这样的,怎么设置padding呢,比如左下角的 我这样设置的
.box{
background:url(左下) no-repeat left bottom;
padding-left:13px;
padding-bottom:13px;
}
这样不可以啊?

你这个图片貌似周边是透明的 ,大部分都是黑灰色的。那应该让背景色 尽量跟 这个角图 的颜色 对比强些。还有 div就不要设置背景色了,让他继承body的背景就好看了 

你这个图片貌似周边是透明的 ,大部分都是黑灰色的。那应该让背景色 尽量跟 这个角图 的颜色 对比强些。还有 div就不要设置背景色了,让他继承body的背景就好看了
 
现在要的是有背景颜色div一个区域,角是圆角的效果,div背景颜色和图片的颜色一致,网上有许多不需要图片的例子,如果用这四个角的图片是怎么设置的

你这个图片貌似周边是透明的 ,大部分都是黑灰色的。那应该让背景色 尽量跟 这个角图 的颜色 对比强些。还有 div就不要设置背景色了,让他继承body的背景就好看了

你给我的代码,四个图是加上了,怎么才能把圆角外的div颜色和body的颜色一致

你div设置背景色了?

你div设置背景色了?

对的 设置了

楼主可以起看《CSS彻底设计与研究》这本书,里面讲的比较详细,也可以去看看下这篇文章 CSS圆角制作,希望对楼主有所帮助~

这就不好办了 ,因为你的那个小图片 的角落 是透明的 ,你的div如果设置了背景色,并且跟 body的背景色不一致的话,那这种技术就是失败的 

这就不好办了 ,因为你的那个小图片 的角落 是透明的 ,你的div如果设置了背景色,并且跟 body的背景色不一致的话,那这种技术就是失败的

好吧 还是好好谢谢你了,没办法设计就是这样。我就按网上说的不要图的那种设计更改吧

border-radius:5px

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage