像这种效果，请问有没有bootstrap的控件呢？或者用普通的css怎么布局？
回复讨论(解决方案)
图片， 定位
大容器相对定位，图片绝对定位，负值
完全听不懂啊
完全听不懂那你问个球。。。。。div+CSS去学学吧
<style type="text/css">*{margin:0;padding:0}.box{position:relative;width:400px;height:300px;background:#fafafa;border:1px solid #ccc;margin:50px 0 0 50px}.arrow{position:absolute;top:-20px;right:0;width:50px;height:50px;background:#f00;color:#fff;}</style><div class="box"> <div class="arrow">右上角</div> <p>中华人民共和国中华人民共和国</p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/ai/1152" title="Canva"><img
src="https://img.php.cn/upload/ai_manual/000/000/000/175680108933319.png" alt="Canva" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/ai/1152" title="Canva">Canva</a>
<p>使用Canva可画，轻松创建专业设计</p>
</div>
<a href="/ai/1152" title="Canva" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div></div>把arrow里的换成你右上角的图。。
<style type="text/css">*{margin:0;padding:0}.box{position:relative;width:400px;height:300px;background:#fafafa;border:1px solid #ccc;margin:50px 0 0 50px}.arrow{position:absolute;top:-20px;right:0;width:50px;height:50px;background:#f00;color:#fff;}</style><div class="box"> <div class="arrow">右上角</div> <p>中华人民共和国中华人民共和国</p></div>
把arrow里的换成你右上角的图。。
谢谢你的回答
立即学习“前端免费学习笔记（深入）”；
