• 查看作者
    • 头部导航栏顶部 – 搜索栏

      需要拉大 Logo 隐藏原来搜索图标

      将代码放到外光布局 – > 首页设置(电脑端) -> 【头部导航栏顶部】自定义内容 即可。

      <div class="jinsom-header-content clear">
       
      <div class="jinsom-menu"><ul id="menu-menu-1" class="clear" style="margin-left:220px;margin-top:22px;">
        <li id="menu-item-17" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-17"><div class="jinsom-pop-search-container">
        <div class="jinsom-pop-search-content">
          <input type="text" placeholder="搜索您感兴趣的内容">
          <span class="opacity">搜索</span>
        </div>
      </div>
      </li>
      </ul>
      </div> 
      </div>
       
      <style>
      /*导航剪短*/
      .jinsom-menu-fixed {
          padding-top: 00px !important;
      }
      /*搜索栏 颜色*/
      .jinsom-pop-search-content input {
          width: 380px;
          padding: 0px 10px;
          line-height: 36px;
          flex: 3;
          border-radius: 3px 0 0 0px !important;
          background-color: #f9f9f9 !important;
          border-color: #777777 !important;
          border: 0.5px solid #a1a1a1 !important;
      }
      /*搜索栏 高度*/
      .jinsom-pop-search-content {
          height: 32px;
          padding: 0 0 40px;
          display: flex;
      }
      /*搜索按钮 颜色*/
      .jinsom-pop-search-content span {
          background-color: #777;
          color: #fff;
          cursor: pointer;
          height: 32px;
          flex: 1;
          line-height: 31px;
          font-size: 16px;
          border-radius: 0 3px 3px 0;
      }
      /*logo上偏*/
      .jinsom-header-content .logo a {
          float: left;
          width: 300px;
          height: 76px;
          margin-top: -40px;
          margin-left: -50px;
          background: url(../../images/logo.png);
          background-repeat: no-repeat !important;
          background-size: cover;
      }
      /*menu偏移右边*/
      .jinsom-menu {
          width: 500px;
          float: left;
          height: 50px;
          margin-left: 45px;
      }
      /*menu 头像偏移左边*/
      .jinsom-header-right {
          float: right;
          position: relative;
          height: 50px;
          margin-right: 67px;
      }
      /*导航不固定*/
      .jinsom-header {
          position: unset;
          z-index: 1001;
          background-color: #fff !important;
          width: 100%;
          margin: auto;
          min-width: 1100px;
          color: #fff;
      }
      </style>

    • 0
    • 0
    • 0
    • 10
    • 请登录之后再进行评论

      登录
    • 做任务
    • 发表内容