<template> <div class="content content-with-bord" style="cursor: pointer; position: relative;"> <!--左上边框--> <div class="t_line_box"> <i class="t_l_line"></i> <i class="l_t_line"></i> </div> <!--右上边框--> <div class="t_line_box"> <i class="t_r_line"></i> <i class="r_t_line"></i> </div> <!--左下边框--> <div class="t_line_box"> <i class="l_b_line"></i> <i class="b_l_line"></i> </div> <!--右下边框--> <div class="t_line_box"> <i class="r_b_line"></i> <i class="b_r_line"></i> </div> <div class="content-title"> <slot name="title"></slot> </div> <div> <slot name="content"></slot> </div> </div> </template> <script> export default { name:"TitleContentWithBord", data() { return { }; }, methods: {} }; </script> <style scoped> div{ color: white; } .content-with-bord{ box-sizing: border-box; border: 1px solid #2C58A6; position: relative; box-shadow: 0 0 10px #2C58A6; } .content-title{ line-height: 50px; font-size: 20px; font-weight: bold; padding-left: 20px; } </style> <style scoped lang="css" src="../../assets/index.css"/>