[英]Css arrow to content tab box
I have a easy responsive content tab. 我有一个简单的响应内容选项卡。 I want to add css arrow to the content box which should point towards the respective menu item. 我想在内容框中添加css箭头,该内容框应指向相应的菜单项。
How do I get it dynamically for each tab content boxes. 如何为每个选项卡内容框动态获取它。
Here is my code 这是我的代码
$(document).ready(function () {
$('#verticalTab').easyResponsiveTabs({
type: 'vertical',
width: 'auto',
fit: true
});
});
Add position: relative;
添加position: relative;
to .resp-vtabs .resp-tabs-list li
then add the following CSS: 到.resp-vtabs .resp-tabs-list li
然后添加以下CSS:
.resp-vtabs .resp-tabs-list li.resp-tab-active:after {
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
right: -5%;
top: 0;
border: 10px solid transparent;
border-right-color: red;
}
You can change the border-right-color
to change the color of the arrow. 您可以更改border-right-color
以更改箭头的颜色。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.