使用 css/bootstrap 在图像周围为个人资料图片添加边框

Question

嘿，伙计们，我正在尝试在此图像周围设置一个边框，如下所示：border blue around picture 这是我尝试过的代码，我也希望它位于页面的左角。我在这里先向您的帮助表示感谢。这是我现在拥有的代码的预览：https://jsfiddle.net/7hdrhs2r/3/ HTML：

<div class="container">
<div class="row">
        <!-- Picture must be 600px X 600px-->
        <div class="col-lg-5 col-xs-6" id="picturebox">

      <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/fa/Apple_logo_black.svg/600px-Apple_logo_black.svg.png" alt="profile pic" height="10%" width="10%"/>
        </div>
</div>

CSS

#picturebox{
       border-color:midnightblue;
        margin: 0 auto;
     border:10px solid #ccc;
     border-right: 200%;
         padding:20px 60px 0px 2px ;
         height: 100%
        width:50%;
        background-color:lightblue;
    }

Answer 1

#picturebox img {
  border: solid 3px red;
  padding: 5px;
  background-color: lightblue;
}

JSfiddle

注意：要注释掉 CSS，请执行以下操作：

/* code */

也适用于多行 cmets：

/* code
code */