HTML+css实现图片带边框在左，文字在右，文字上下两行（如图，将图一变为图二）

img

img

可以使用flex布局嵌套来做：
先分成左右两块，再把右边分成上下两块，改变flex方向改成垂直布局，如下：
如有帮助，望采纳 ^.^ 谢谢啦~

img

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <style>
    *{
        box-sizing: border-box;  //转换成标准盒模型
    }
      .box{
          width: 300px;
          height: 100px;
          display: flex;
          border: 1px solid #ccc;
          padding: 10px;
      }
      img{
          width: 80px;
          height: 80px;
      }
      .right{
          flex: 1;
          height: 100%;
          display: flex;
          flex-direction: column;
          justify-content: space-around;
          padding-left: 20px;
      }
     
    </style>
    <body>
        <div class="box">
           <img src="img/图片.jpg">
           <div class="right">
               <div class="right_top">第一行标题</div>
               <div class="right_bottom">第二行简介</div>
           </div>
        </div>
    </body>
</html>

使用flex布局，先分为左右两个盒子水平分布，在右边盒子里的两个小盒子上下垂直分布。如有帮助，望采纳！

浮动/定位/inline-block都可以吧，图片设置个border-radius:50%,再设置个border

左右两个盒子，浮动或者不考虑ie兼容用flex