한쪽에만 CSS 테두리를 설정하려면 어떻게해야합니까?

한쪽에만 CSS 테두리를 설정하려면 어떻게해야합니까?

---

주어진 div경우 왼쪽, 오른쪽, 위쪽 또는 아래쪽에만 테두리를 표시하고 싶습니다.

현재 나는 모든면에 테두리를 두는 다음이 있습니다.

#testdiv {
   border: 1px solid;
}

왼쪽에만 테두리 를 표시하려면 어떻게해야 합니까?

---

#testdiv {
   border-left: 1px solid;
}

border에 대한 MDN 설명서를 참조하십시오 .

---

    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
}

데모

---

4면을 별도로 설정하려면 다음을 사용하십시오.

border-width: 1px 2em 5px 0; /* top right bottom left */
border-style: solid dotted inset double;
border-color: #f00 #0f0 #00f #ff0;

---

모든 테두리에 대해 별도로 테두리를 지정할 수 있습니다. 예를 들면 다음과 같습니다.

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

테두리 모양을 지정하고 위쪽, 오른쪽, 아래쪽 및 왼쪽 테두리에 별도의 스타일을 사용할 수도 있습니다. 예를 들면 :

#testdiv{
  border: 1px #000;
  border-style: none solid none solid;
}

---

이렇게 해봐

#testdiv{
  border-left:1px solid;

}

---

#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;
}

참고 URL : https://stackoverflow.com/questions/15405307/how-can-i-set-a-css-border-on-one-side-only