使用一些魔术:after伪对象,你甚至不需要改变html标记=)
你可以尝试这样的事情:
nav ul li.selected:after{
content:'';
float:right;
width: 0;
height: 0;
border-top: 16px solid transparent;
border-bottom: 16px solid transparent;
border-right: 20px solid #ef5a29;
}
或者正如我在下面的jsfiddle中所做的那样:
nav ul li.selected a:after{
content:'';
position:absolute;
top:20px;
right:0;
width: 0;
height: 0;
border-top: 16px solid transparent;
border-bottom: 16px solid transparent;
border-right: 20px solid #ef5a29;
}
另请注意,我从li移动了填充,并为此示例添加了display:block to a.