fx66/src/components/specialTitle.vue

<template>
    <div class="title-container">
      <div class="main-title-container">
        <hr>
        <h1 class="title">{{title}}</h1>
        <hr>

      </div>
      <h2 class="eng-title">{{engTitle}}</h2>
    </div>
</template>

<script>

    export default {
      name: "specialTitle",
      props:['title','engTitle']
    }
</script>

<style scoped lang="less">
  @import "../assets/less/_variable.less";
  .title-container{

    & .main-title-container{
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 1200px;
      hr{
        width: 420px;
        border: solid 1px #e5e5e5;
      }
      .title{
        /*margin: 0 20px;*/
        font-size: 35px;
        line-height: 35px;
        font-weight: 700;
        color: lightBlack;
      }
    }
    & .eng-title{
      margin-top: 13px;
      font-size: 20px;
      color: @lighterBlack;
    }
  }
</style>