BJ_web_developers / dyitoc

  <template>

    <div class="title">

      <span>{{title}}</span>

    </div>

  </template>
  
  <script>
  export default {

    name: 'titlesection',
    props:['title'],
    created() {

      // console.log(this.title)

    }

  }
  </script>
  
  <style scoped>

    .title {

      height: 30px;
      line-height: 30px;

      padding-left: 60px;
      background: url("../assets/img/titlebg.png") no-repeat;
      background-size: 100% 100%;
      font-size: 14px;
      font-weight:500;
      color:rgba(255,255,255,1);
  
    }
    .title span{
      position: relative;
      display: inline-block;
      box-sizing: border-box;
    }
    .title span:before{
      content: '';
      position: absolute;
      top:0;
      left: -55px;
      width: 50px;
      height: 30px;
      background: url("../assets/img/titletexticon.png") no-repeat 0 center;
      background-size: 100% 35%;
    }
    .title span:after{
      content: '';
      position: absolute;
      top:0;
      right: -55px;
      width: 50px;
      height: 30px;
      background: url("../assets/img/titletexticon.png") no-repeat 0 center;
      background-size: 100% 35%;

    }
  </style>