What is a fallback for the “hamburger icon” or HTML entity ☰?

后端 未结 3 1947
眼角桃花
眼角桃花 2021-01-14 13:21

I have this as my menu bar for the site when viewed on tablet:

\"Header

The menu icon on the rig

3条回答
  •  -上瘾入骨i
    2021-01-14 13:37

    The solution used by Twitter Bootstrap is using spans to construct the Hamburger:

    
    

    The corresponding CSS is:

    .navbar-toggle {
       position: relative;
       float: right;
       padding: 9px 10px;
       margin-top: 8px;
       margin-right: 15px;
       margin-bottom: 8px;
       background-color: #cccccc;
       border: 1px solid transparent;
       border-radius: 4px;
    }
    
    .navbar-toggle .icon-bar {
       display: block;
       width: 22px;
       height: 2px;
       background-color:#000000;
       border-radius: 1px;
    }
    
    .navbar-toggle .icon-bar+.icon-bar {
       margin-top: 4px;
    }
    

提交回复
热议问题