ulthon/layui-ul
1
0
Fork 0
mirror of https://gitee.com/ulthon/layui-ul.git synced 2026-07-01 10:32:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 迁移经典头部

Browse Source
This commit is contained in:
augushong
2025-09-01 12:21:56 +08:00
parent 18126c2574
commit 9178287e44
12 changed files with 236 additions and 3555 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
source/components/_index.scss
View File

@@ -22,6 +22,7 @@
@import './element/ul-loading-pos/index';
@import './group_panel/ul-group-list/index';
@import './header/ul-header/index';
@import './header/ul-header-a/index';
@import './header/ul-header-shape/index';
@import './header/ul-shop-header/index';
@import './list/ul-ad-list/index';

6
source/components/header/ul-header-a/_index.env Normal file
View File

@@ -0,0 +1,6 @@
title=经典头部
padding=0
margin=0
gray=0
mobile=0
inner_margin=0

111
source/components/header/ul-header-a/_index.html Normal file
View File

@@ -0,0 +1,111 @@
<div class="ul-section">
<div class="ul-header-a">
<div class="ul-header-a-main">
<div class="ul-header-a-left">
Hi:欢迎来到{:get_system_config('site_name')}
</div>
<div class="ul-header-a-right">
<div
class="ul-header-a-nav-item"
style="min-width: 100px;"
>
<div
class="ul-header-a-img ul-demo-img-bg"
>
</div>
<span>奥宏科技</span>
<div
class="ul-header-a-nav-plus"
style="left: 0;width: 100%"
>
<div
class="ul-nav-min"
style="width: 100%"
>
<div class="ul-nav-min-item">
个人中心
</div>
<div class="ul-nav-min-item">
安全中心
</div>
<div class="ul-nav-min-item">
数据中心
</div>
</div>
</div>
</div>
<div class="ul-header-a-nav-item">
充值
</div>
<div class="ul-header-a-nav-item">
提现
</div>
<div class="ul-header-a-nav-item">
退出
</div>
<div class="ul-header-a-nav-item">
<div class="layui-btn layui-btn-xs">在线客服</div>
</div>
</div>
</div>
</div>
</div>
<div class="ul-section">
<div class="ul-header-a">
<div
class="ul-header-a-main"
style="max-width: 600px;"
>
<div class="ul-header-a-left">
Hi:欢迎来到{:get_system_config('site_name')}
</div>
<div class="ul-header-a-right">
<div
class="ul-header-a-nav-item"
style="min-width: 100px;"
>
<div
class="ul-header-a-img ul-demo-img-bg"
>
</div>
<span>奥宏科技</span>
<div
class="ul-header-a-nav-plus"
style="left: 0;width: 100%"
>
<div
class="ul-nav-min"
style="width: 100%"
>
<div class="ul-nav-min-item">
个人中心
</div>
<div class="ul-nav-min-item">
安全中心
</div>
<div class="ul-nav-min-item">
数据中心
</div>
</div>
</div>
</div>
<div class="ul-header-a-nav-item">
充值
</div>
<div class="ul-header-a-nav-item">
提现
</div>
<div class="ul-header-a-nav-item">
退出
</div>
<div class="ul-header-a-nav-item">
<div class="layui-btn layui-btn-xs">在线客服</div>
</div>
</div>
</div>
</div>
</div>

0
source/components/header/ul-header-a/_index.md Normal file
View File

5
source/components/header/ul-header-a/_index.php Normal file
View File

@@ -0,0 +1,5 @@
<?php
return [
];

56
source/components/header/ul-header-a/_index.scss Normal file
View File

@@ -0,0 +1,56 @@
.ul-header-a {
background-color: #f8f8f8;
border-bottom : 1px solid #e8e8e8;
color : #666;
}
.ul-header-a-main {
display : flex;
align-items : center;
justify-content: space-between;
/* border-width: 1px 0;
border-color : #bbb;
border-style : solid; */
padding : 5px;
margin : 0 auto;
}
.ul-header-a-nav-item {
margin-right: 15px;
position : relative;
display : flex;
align-items : center;
cursor : pointer;
}
.ul-header-a-nav-item:hover .ul-header-a-nav-plus {
display: block;
}
.ul-header-a-img {
height : 24px;
width : 24px;
background-size : cover;
background-position: center;
margin-right : 10px;
}
.ul-header-a-right {
display : flex;
align-items: center;
}
.ul-header-a-nav-plus {
position : absolute;
top : 100%;
left : 50%;
display : none;
background-color: transparent;
z-index : 99999;
}
.ul-header-a-nav-plus>.ul-nav-min {
background-color: #fff;
margin-top : 15px;
}