我正在尝试在导航菜单上创建一个回合(右下角)角。我有一个标记为" main-nav
"的UL ID,并创建了一个标有" round
"的LI类。我在音乐链接中添加了这个Li课程以获取圆角,但什么也没发生。
这是小提琴//http://jsfiddle.net/2qrlu/3/
您写了.round li
,这将尝试针对"圆形"类嵌套在元素中的列表项目。
您需要编写li.round
此目标列表项目,这些项目上有"圆"。
请注意,空间很重要,编写li .round
是错误的,因为这将针对具有"圆形"类的列表项目的孩子。
http://jsfiddle.net/2qrlu/4/
如果您想单独样式拐角,则可以使用更具体的版本:
border-top-left-radius:5px;
border-top-right-radius:10px;
border-bottom-left-radius:15px;
border-bottom-right-radius:20px;
我在这里对它们进行了样式显示不同的类型,但是实际上,您可能只想设置一个角落,因此,这是您的小提琴版本,只有右下角弯曲的曲线:http://jsfiddle。net/2qrlu/6/
另外,作为旁注,除非您需要支持浏览器的较旧版本,否则仅在没有所有供应商前缀的情况下编写Border-Radius就足够安全。浏览器现在不需要Border-Radius一段时间了。
您可以在此处没有浏览器上的前缀进行测试:http://jsfiddle.net/2qrlu/5/