How can I set a css border on one side only?

前端 未结 6 1815
既然无缘
既然无缘 2021-01-31 00:59

For a given div I would like to only display a border on the left, right, top, or bottom side.

Currently I have the following, which puts a border on all s

相关标签:
6条回答
  • 2021-01-31 01:33
    #testdiv {
       border-left: 1px solid;
    }
    

    See the MDN documentation on border.

    0 讨论(0)
  • 2021-01-31 01:33

    Try like this

    #testdiv{
      border-left:1px solid;
    

    }

    0 讨论(0)
  • 2021-01-31 01:37
    #testDiv{
        /* set green border independently on each side */
        border-left: solid green 2px;
        border-right: solid green 2px;
        border-bottom: solid green 2px;
        border-top: solid green 2px;
    }
    
    0 讨论(0)
  • 2021-01-31 01:49
        div{
        border-left:solid red 3px;
        border-right:solid violet 4px;
        border-top:solid blue 4px;
        border-bottom:solid green 4px;
        background:grey;
        width:100px; height:50px
    }
    

    DEMO

    0 讨论(0)
  • 2021-01-31 01:50

    You can specify border separately for all borders, for example:

    #testdiv{
      border-left: 1px solid #000;
      border-right: 2px solid #FF0;
    }
    

    You can also specify the look of the border, and use separate style for the top, right, bottom and left borders. for example:

    #testdiv{
      border: 1px #000;
      border-style: none solid none solid;
    }
    
    0 讨论(0)
  • 2021-01-31 01:57

    If you want to set 4 sides separately use:

    border-width: 1px 2em 5px 0; /* top right bottom left */
    border-style: solid dotted inset double;
    border-color: #f00 #0f0 #00f #ff0;
    
    0 讨论(0)
提交回复
热议问题