Skip to content

梁建民 / liebaochHtml

Go to a project
Commit 8a3dde66 by LJM
Options

initial

parent 1f71fb16
Expand all
Inline Side-by-side
Showing with 1519 additions and 9 deletions
css/base.less
......@@ -132,3 +132,8 @@ body {
.verCenter {
align-items: center;
}
.main {
width: 1280px;
margin: 0 auto;
}
css/font/demo.css 0 → 100644
/* Logo 字体 */
@font-face {
font-family: "iconfont logo";
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}
.logo {
font-family: "iconfont logo";
font-size: 160px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* tabs */
.nav-tabs {
position: relative;
}
.nav-tabs .nav-more {
position: absolute;
right: 0;
bottom: 0;
height: 42px;
line-height: 42px;
color: #666;
}
#tabs {
border-bottom: 1px solid #eee;
}
#tabs li {
cursor: pointer;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
position: relative;
z-index: 1;
margin-bottom: -1px;
color: #666;
}
#tabs .active {
border-bottom-color: #f00;
color: #222;
}
.tab-container .content {
display: none;
}
/* 页面布局 */
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main .logo {
color: #333;
text-align: left;
margin-bottom: 30px;
line-height: 1;
height: 110px;
margin-top: -50px;
overflow: hidden;
*zoom: 1;
}
.main .logo a {
font-size: 160px;
color: #333;
}
.helps {
margin-top: 40px;
}
.helps pre {
padding: 20px;
margin: 10px 0;
border: solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists {
width: 100% !important;
overflow: hidden;
*zoom: 1;
}
.icon_lists li {
width: 100px;
margin-bottom: 10px;
margin-right: 20px;
text-align: center;
list-style: none !important;
cursor: default;
}
.icon_lists li .code-name {
line-height: 1.2;
}
.icon_lists .icon {
display: block;
height: 100px;
line-height: 100px;
font-size: 42px;
margin: 10px auto;
color: #333;
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
-moz-transition: font-size 0.25s linear, width 0.25s linear;
transition: font-size 0.25s linear, width 0.25s linear;
}
.icon_lists .icon:hover {
font-size: 100px;
}
.icon_lists .svg-icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em;
/* 图标和文字相邻时，垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
.icon_lists li .name,
.icon_lists li .code-name {
color: #666;
}
/* markdown 样式 */
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p {
margin: 1em 0;
}
.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
width: 80%;
}
.markdown ul>li {
list-style: circle;
}
.markdown>ul li,
.markdown blockquote ul>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown>ul li p,
.markdown>ol li p {
margin: 0.6em 0;
}
.markdown ol>li {
list-style: decimal;
}
.markdown>ol li,
.markdown blockquote ol>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown>table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown>table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown>table th,
.markdown>table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown>table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown>br,
.markdown>p>br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre)>code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre)>code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function,
.token.class-name {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
css/font/iconfont.css 0 → 100644
@font-face {
font-family: "iconfont"; /* Project id 4497966 */
src: url('iconfont.woff2?t=1712542359775') format('woff2'),
url('iconfont.woff?t=1712542359775') format('woff'),
url('iconfont.ttf?t=1712542359775') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-duoyuyan:before {
content: "\e7b0";
}
.icon-qq:before {
content: "\e7a9";
}
.icon-xinpianbeifen:before {
content: "\e7aa";
}
.icon-kefu:before {
content: "\e7ab";
}
.icon-fuwu:before {
content: "\e7ac";
}
.icon-xinpian:before {
content: "\e7ad";
}
.icon-weixin:before {
content: "\e7ae";
}
.icon-jiantou_xiayiye:before {
content: "\e7af";
}
.icon-a-xinpianbeifen6:before {
content: "\e7a1";
}
.icon-a-xinpianbeifen3:before {
content: "\e7a2";
}
.icon-a-xinpianbeifen2:before {
content: "\e7a3";
}
.icon-baozhang:before {
content: "\e7a0";
}
.icon-a-xinpianbeifen7:before {
content: "\e7a4";
}
.icon-a-xinpianbeifen4:before {
content: "\e7a5";
}
.icon-huojian:before {
content: "\e7a6";
}
.icon-xiaoshouhanjine:before {
content: "\e7a7";
}
.icon-a-xinpianbeifen5:before {
content: "\e7a8";
}
css/font/iconfont.json 0 → 100644
{
"id": "4497966",
"name": "liebao",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "39843205",
"name": "多语言",
"font_class": "duoyuyan",
"unicode": "e7b0",
"unicode_decimal": 59312
},
{
"icon_id": "39842899",
"name": "qq",
"font_class": "qq",
"unicode": "e7a9",
"unicode_decimal": 59305
},
{
"icon_id": "39842897",
"name": "芯片备份",
"font_class": "xinpianbeifen",
"unicode": "e7aa",
"unicode_decimal": 59306
},
{
"icon_id": "39842895",
"name": "客服",
"font_class": "kefu",
"unicode": "e7ab",
"unicode_decimal": 59307
},
{
"icon_id": "39842901",
"name": "服务",
"font_class": "fuwu",
"unicode": "e7ac",
"unicode_decimal": 59308
},
{
"icon_id": "39842900",
"name": "芯片",
"font_class": "xinpian",
"unicode": "e7ad",
"unicode_decimal": 59309
},
{
"icon_id": "39842896",
"name": "微信",
"font_class": "weixin",
"unicode": "e7ae",
"unicode_decimal": 59310
},
{
"icon_id": "39842894",
"name": "箭头_下一页",
"font_class": "jiantou_xiayiye",
"unicode": "e7af",
"unicode_decimal": 59311
},
{
"icon_id": "39842909",
"name": "芯片备份 6",
"font_class": "a-xinpianbeifen6",
"unicode": "e7a1",
"unicode_decimal": 59297
},
{
"icon_id": "39842905",
"name": "芯片备份 3",
"font_class": "a-xinpianbeifen3",
"unicode": "e7a2",
"unicode_decimal": 59298
},
{
"icon_id": "39842908",
"name": "芯片备份 2",
"font_class": "a-xinpianbeifen2",
"unicode": "e7a3",
"unicode_decimal": 59299
},
{
"icon_id": "39842902",
"name": "保障",
"font_class": "baozhang",
"unicode": "e7a0",
"unicode_decimal": 59296
},
{
"icon_id": "39842907",
"name": "芯片备份 7",
"font_class": "a-xinpianbeifen7",
"unicode": "e7a4",
"unicode_decimal": 59300
},
{
"icon_id": "39842904",
"name": "芯片备份 4",
"font_class": "a-xinpianbeifen4",
"unicode": "e7a5",
"unicode_decimal": 59301
},
{
"icon_id": "39842903",
"name": "火箭",
"font_class": "huojian",
"unicode": "e7a6",
"unicode_decimal": 59302
},
{
"icon_id": "39842898",
"name": "销售含金额",
"font_class": "xiaoshouhanjine",
"unicode": "e7a7",
"unicode_decimal": 59303
},
{
"icon_id": "39842906",
"name": "芯片备份 5",
"font_class": "a-xinpianbeifen5",
"unicode": "e7a8",
"unicode_decimal": 59304
}
]
}
css/font/iconfont.ttf 0 → 100644
No preview for this file type
css/font/iconfont.woff 0 → 100644
No preview for this file type
css/font/iconfont.woff2 0 → 100644
No preview for this file type
css/style.less
@charset "utf-8";
@import "base.less";
body{
background: #ff5a2b;
.head {
height: 100px;
background: url("../images/head-bg.png") no-repeat top center;
.main {
height: 100px;
.logo {
width: 122px;
height: 58px;
}
.menu-box {
height: 100%;
.menu {
height: 100%;
li {
height: 100%;
margin-right: 40px;
a {
font-size: 16px;
color: #FFFFFF;
}
}
}
.simplified-chinese {
.iconfont {
margin-right: 4px;
font-size: 20px;
color: #cbdaeb;
}
span {
font-size: 16px;
color: #ffffff;
opacity: 0.8;
}
}
}
}
}
.slide-box {
width: 100%;
height: 620px;
background: #365C89;
}
.service {
padding: 70px 0 80px 0;
.title {
font-size: 38px;
color: #000;
font-weight: bold;
line-height: 53px;
margin-bottom: 23px;
}
.list {
li {
position: relative;
width: 416px;
height: 360px;
margin-right: 16px;
&:last-child {
margin-right: 0;
}
a {
display: block;
img {
width: 416px;
height: 360px;
object-fit: cover;
display: block;
}
.text {
position: absolute;
bottom: 24px;
left: 20px;
font-size: 24px;
color: #ffffff;
line-height: 33px;
}
}
}
}
}
.international-logistics-services {
padding: 70px 0 140px 0;
background: url("../images/international-logistics-services.png") no-repeat top center;
background-size: cover;
.title {
font-size: 38px;
color: #ffffff;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.text {
width: 1235px;
margin: 0 auto;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
line-height: 29px;
text-align: center;
opacity: 0.8;
}
.list {
margin-top: 133px;
box-sizing: border-box;
li {
width: 266px;
height: 112px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-sizing: border-box;
margin-right: 20px;
&:last-child {
margin-right: 0;
}
.iconfont {
font-size: 64px;
color: #fff;
margin-right: 54px;
}
span {
font-size: 18px;
color: #ffffff;
font-weight: bold;
}
}
}
}
.service-categories {
padding: 80px 0 80px 0;
.title {
font-size: 38px;
color: #000000;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.text {
font-size: 18px;
color: #474747;
opacity: 0.8;
text-align: center;
margin-bottom: 40px;
}
.list {
li {
position: relative;
width: 308px;
height: 160px;
background: #F3F3F3;
margin-right: 16px;
&:last-child {
margin-right: 0;
}
.iconfont {
position: absolute;
right: 12px;
bottom: 11px;
font-size: 82px;
color: #0d8dda;
}
span {
position: absolute;
top: 24px;
left: 35px;
font-size: 20px;
color: #000000;
font-weight: bold;
line-height: 28px;
}
}
}
}
.cooperation {
padding: 81px 0 159px 0;
background: url("../images/cooperation.png") top center;
background-size: cover;
.cooperation-form-box {
position: relative;
width: 480px;
box-sizing: border-box;
background: #FFFFFF;
box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.3);
margin: 0 auto;
padding: 20px 0 22px 0;
.arrow {
position: absolute;
top: 25px;
left: 0;
width: 5px;
height: 26px;
background: #F8B62D;
}
.box {
width: 420px;
margin: 0 auto;
.title {
font-size: 24px;
color: #000000;
font-weight: bold;
line-height: 33px;
}
.tip {
font-size: 12px;
color: #989898;
opacity: 0.8;
line-height: 17px;
}
.cooperation-form {
.form-input {
label {
font-size: 14px;
color: #474747;
font-weight: bold;
line-height: 20px;
margin-bottom: 4px;
&:before {
font-size: 14px;
font-weight: bold;
color: #0d8dda;
content: "*";
}
}
.inp {
width: 200px;
height: 40px;
padding-left: 10px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
}
.layui-form-checked[lay-skin=primary] {
&:hover {
i {
border-color: #0D8DDA !important;
}
}
i {
border-color: #0D8DDA !important;
background-color: #0D8DDA;
}
}
}
.textared-box {
width: 420px;
height: 80px;
margin-bottom: 20px;
box-sizing: border-box;
textarea {
width: 420px;
height: 80px;
padding: 5px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
resize: none;
}
}
}
.btn {
width: 420px;
height: 48px;
background: #0D8DDA;
border-radius: 6px;
font-size: 18px;
color: #FFFFFF;
line-height: 25px;
font-weight: bold;
letter-spacing: 2px;
}
}
}
}
\ No newline at end of file
css/style.min.css
......@@ -158,7 +158,267 @@ body {
.verCenter {
align-items: center;
}
body {
background: #ff5a2b;
.main {
width: 1280px;
margin: 0 auto;
}
.head {
height: 100px;
background: url("../images/head-bg.png") no-repeat top center;
}
.head .main {
height: 100px;
}
.head .main .logo {
width: 122px;
height: 58px;
}
.head .main .menu-box {
height: 100%;
}
.head .main .menu-box .menu {
height: 100%;
}
.head .main .menu-box .menu li {
height: 100%;
margin-right: 40px;
}
.head .main .menu-box .menu li a {
font-size: 16px;
color: #FFFFFF;
}
.head .main .menu-box .simplified-chinese .iconfont {
margin-right: 4px;
font-size: 20px;
color: #cbdaeb;
}
.head .main .menu-box .simplified-chinese span {
font-size: 16px;
color: #ffffff;
opacity: 0.8;
}
.slide-box {
width: 100%;
height: 620px;
background: #365C89;
}
.service {
padding: 70px 0 80px 0;
}
.service .title {
font-size: 38px;
color: #000;
font-weight: bold;
line-height: 53px;
margin-bottom: 23px;
}
.service .list li {
position: relative;
width: 416px;
height: 360px;
margin-right: 16px;
}
.service .list li:last-child {
margin-right: 0;
}
.service .list li a {
display: block;
}
.service .list li a img {
width: 416px;
height: 360px;
object-fit: cover;
display: block;
}
.service .list li a .text {
position: absolute;
bottom: 24px;
left: 20px;
font-size: 24px;
color: #ffffff;
line-height: 33px;
}
.international-logistics-services {
padding: 70px 0 140px 0;
background: url("../images/international-logistics-services.png") no-repeat top center;
background-size: cover;
}
.international-logistics-services .title {
font-size: 38px;
color: #ffffff;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.international-logistics-services .text {
width: 1235px;
margin: 0 auto;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
line-height: 29px;
text-align: center;
opacity: 0.8;
}
.international-logistics-services .list {
margin-top: 133px;
box-sizing: border-box;
}
.international-logistics-services .list li {
width: 266px;
height: 112px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-sizing: border-box;
margin-right: 20px;
}
.international-logistics-services .list li:last-child {
margin-right: 0;
}
.international-logistics-services .list li .iconfont {
font-size: 64px;
color: #fff;
margin-right: 54px;
}
.international-logistics-services .list li span {
font-size: 18px;
color: #ffffff;
font-weight: bold;
}
.service-categories {
padding: 80px 0 80px 0;
}
.service-categories .title {
font-size: 38px;
color: #000000;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.service-categories .text {
font-size: 18px;
color: #474747;
opacity: 0.8;
text-align: center;
margin-bottom: 40px;
}
.service-categories .list li {
position: relative;
width: 308px;
height: 160px;
background: #F3F3F3;
margin-right: 16px;
}
.service-categories .list li:last-child {
margin-right: 0;
}
.service-categories .list li .iconfont {
position: absolute;
right: 12px;
bottom: 11px;
font-size: 82px;
color: #0d8dda;
}
.service-categories .list li span {
position: absolute;
top: 24px;
left: 35px;
font-size: 20px;
color: #000000;
font-weight: bold;
line-height: 28px;
}
.cooperation {
padding: 81px 0 159px 0;
background: url("../images/cooperation.png") top center;
background-size: cover;
}
.cooperation .cooperation-form-box {
position: relative;
width: 480px;
box-sizing: border-box;
background: #FFFFFF;
box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.3);
margin: 0 auto;
padding: 20px 0 22px 0;
}
.cooperation .cooperation-form-box .arrow {
position: absolute;
top: 25px;
left: 0;
width: 5px;
height: 26px;
background: #F8B62D;
}
.cooperation .cooperation-form-box .box {
width: 420px;
margin: 0 auto;
}
.cooperation .cooperation-form-box .box .title {
font-size: 24px;
color: #000000;
font-weight: bold;
line-height: 33px;
}
.cooperation .cooperation-form-box .box .tip {
font-size: 12px;
color: #989898;
opacity: 0.8;
line-height: 17px;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input label {
font-size: 14px;
color: #474747;
font-weight: bold;
line-height: 20px;
margin-bottom: 4px;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input label:before {
font-size: 14px;
font-weight: bold;
color: #0d8dda;
content: "*";
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input .inp {
width: 200px;
height: 40px;
padding-left: 10px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input .layui-form-checked[lay-skin=primary]:hover i {
border-color: #0D8DDA !important;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input .layui-form-checked[lay-skin=primary] i {
border-color: #0D8DDA !important;
background-color: #0D8DDA;
}
.cooperation .cooperation-form-box .box .cooperation-form .textared-box {
width: 420px;
height: 80px;
margin-bottom: 20px;
box-sizing: border-box;
}
.cooperation .cooperation-form-box .box .cooperation-form .textared-box textarea {
width: 420px;
height: 80px;
padding: 5px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
resize: none;
}
.cooperation .cooperation-form-box .box .btn {
width: 420px;
height: 48px;
background: #0D8DDA;
border-radius: 6px;
font-size: 18px;
color: #FFFFFF;
line-height: 25px;
font-weight: bold;
letter-spacing: 2px;
}
/*# sourceMappingURL=style.min.css.map */
\ No newline at end of file
css/style.min.css.map
{"version":3,"sources":["style.less","base.less"],"names":[],"mappings":"AAAA,SAAS;ACAT;EACI,qBAAA;;AAGJ;EACI,8BAAA;EACA,0BAAA;;AAGJ;AAAM;EACF,iBAAA;EACA,eAAe,mBAAmB,oBAAoB,iEAAiE,uBAAuB,YAA9I;;AAGJ,IAAK;EACD,aAAA;EACA,yCAAA;EACA,6CAAA;;AAGJ;AAAM;AAAK;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAK;AAAM;AAAM;AAAU;AAAQ;AAAO;AAAU;AAAG;AAAY;AAAI;AAAI;AAAI;AAAQ;AAAS;AAAO;AAAS;AAAY;AAAQ;AAAQ;AAAQ;AAAM;AAAK;EACtN,SAAA;EACA,UAAA;;AAGJ;AAAQ;AAAO;AAAQ;EACnB,eAAA;EACA,YAAA;EACA,wBAAA;;AAGJ,KAAK;AAAe,KAAK;AAAa,KAAK;EACvC,eAAA;;AAGJ;EACI,yBAAA;EACA,iBAAA;;AAGJ;AAAI;AAAI;EACJ,gBAAA;;AAGJ;AAAI;AAAI;AAAI;AAAI;AAAI;EAChB,eAAA;EACA,gBAAA;;AAGJ;AAAI;AAAG;EACH,kBAAA;;AAGJ;EACI,qBAAA;;AAGJ;EACI,YAAA;;AAGJ;EACI,QAAA;EACA,WAAA;;AAGJ,IAAI;EACA,SAAS,GAAT;EACA,WAAA;EACA,SAAA;EACA,kBAAA;EACA,cAAA;;AAGJ;EACI,WAAA;EACA,gBAAA;;AAGJ;EACI,YAAA;EACA,gBAAA;;AAGJ;EACI,mBAAA;;AAGJ;EACI,sBAAA;;AAGJ;EACI,sBAAA;;AAGJ;EACI,8BAAA;EACA,sBAAA;;AAGJ;AAAM;EACF,WAAA;EACA,iCAAA;;AAGJ;EACI,kBAAA;;AAEJ;EACI,aAAA;EACA,mBAAA;;AAGJ;EACI,aAAA;EACA,sBAAA;;AAGJ;EACI,8BAAA;;AAGJ;EACI,6BAAA;;AAGJ;EACI,uBAAA;;AAGJ;EACI,mBAAA;;ADjIJ;EACI,mBAAA","file":"style.min.css"}
\ No newline at end of file
{"version":3,"sources":["style.less","base.less"],"names":[],"mappings":"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","file":"style.min.css"}
\ No newline at end of file
favicon.ico
No preview for this file type
index.html
......@@ -10,14 +10,190 @@
<meta name="baidu-site-verification" content="B1YyUdsoGu">
<link href="/favicon.ico" rel="icon">
<title>猎豹出海</title>
<link rel="stylesheet" type="text/css" href="css/font/iconfont.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<link rel="stylesheet" type="text/css" href="js/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="css/style.min.css">
</head>
<body>
<section class="page-main">
<h2 class="wow" style="padding: 20px;text-align: center;font-size: 30px;">猎豹出海</h2>
</section>
<!--head-->
<div class="head">
<div class="main row bothSide verCenter">
<a href="/" class="logo row verCenter">
<img src="./images/logo.png " width="122" height="58" title="猎豹出海" alt="猎豹出海">
</a>
<div class="menu-box row verCenter">
<ul class="menu row verCenter">
<li class="curr row verCenter"><a href="/">首页</a></li>
<li class="row verCenter"><a href="/">国际海运</a></li>
<li class="row verCenter"><a href="/">国际空运</a></li>
<li class="row verCenter"><a href="/">国际陆运</a></li>
<li class="row verCenter"><a href="/">国际铁路</a></li>
<li class="row verCenter"><a href="/">国际铁路</a></li>
<li class="row verCenter"><a href="/">关于我们</a></li>
</ul>
<div class="simplified-chinese row verCenter">
<i class="iconfont icon-duoyuyan"></i>
<span>简体中文</span>
</div>
</div>
</div>
</div>
<!--焦点图-->
<div class="slide-box"></div>
<!--服务中心-->
<div class="service">
<p class="title row rowCenter verCenter">服务中心</p>
<div class="main">
<ul class="list row rowCenter verCenter" style="margin-bottom: 16px;">
<li class="row">
<a href="">
<img src="./images/service-1.png" alt="">
<p class="text">国际海运</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-2.png" alt="">
<p class="text">国际空运</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-3.png" alt="">
<p class="text">国际陆运</p>
</a>
</li>
</ul>
<ul class="list row rowCenter verCenter">
<li class="row">
<a href="">
<img src="./images/service-4.png" alt="">
<p class="text">国际铁路</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-5.png" alt="">
<p class="text">进出口报关</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-6.png" alt="">
<p class="text">国内外仓储</p>
</a>
</li>
</ul>
</div>
</div>
<!--国际物流服务-->
<div class="international-logistics-services">
<p class="title row rowCenter verCenter">国际物流服务</p>
<p class="text">
作为一家国际物流供应链公司，我们整合了先进的智能设备和传感技术，为客户提供实时监控和追踪物流运输过程的能力。我们的智能硬件支持与软件系统的无缝对接，实现数据共享和智能化决策。通过智能硬件的应用，有效提升物流安全性、准确性和可追溯性，提供了更可靠、高效的服务。
</p>
<div class="main">
<ul class="list row rowCenter verCenter">
<li class="row rowCenter verCenter">
<i class="iconfont icon-xiaoshouhanjine"></i>
<span>价格实惠</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-baozhang"></i>
<span>安全可靠</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-huojian"></i>
<span>高效便捷</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-fuwu"></i>
<span>贴心服务</span>
</li>
</ul>
</div>
</div>
<!--服务类目-->
<div class="service-categories">
<p class="title row rowCenter verCenter">服务类目</p>
<p class="text">
作为一家国际物流供应链公司，我们整合了先进的智能设备和传感技术，为客户提供实时监控和追踪物流运输过程的能力。
</p>
<div class="main">
<ul class="list row rowCenter verCenter" style="margin-bottom: 16px">
<li class="row rowCenter verCenter">
<i class="iconfont icon-xinpian"></i>
<span>电子元器件</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-xinpianbeifen"></i>
<span>家居建材</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen2"></i>
<span>电子产品</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen3"></i>
<span>服装类</span>
</li>
</ul>
<ul class="list row rowCenter verCenter">
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen4"></i>
<span>化学品类</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen5"></i>
<span>食品类</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen6"></i>
<span>机械设备</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen7"></i>
<span>日用品类</span>
</li>
</ul>
</div>
</div>
<!--服务类目-->
<div class="cooperation">
<div class="cooperation-form-box">
<b class="arrow"></b>
<div class="box">
<p class="title">咨询合作 / 获取报价</p>
<p class="tip">请填写以下信息，我们会尽快与您联系。您提</p>
<div class="cooperation-form layui-form">
<div class="row bothSide verCenter" style="margin-bottom: 20px;">
<div class="column form-input">
<label>您的姓名:</label>
<input type="text" placeholder="" class="inp">
</div>
<div class="column form-input">
<label>联系方式：</label>
<input type="text" placeholder="" class="inp">
</div>
</div>
<div class="column form-input" style="margin-bottom: 20px;">
<label>您的需求:</label>
<div>
<input type="checkbox" title="国际海运" />
<input type="checkbox" title="国际空运" />
<input type="checkbox" title="国际陆运" />
<input type="checkbox" title="国际铁路" />
</div>
</div>
<div class="textared-box">
<textarea></textarea>
</div>
<a href="javascript:;" class="btn row rowCenter verCenter">提交</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/layui/layui.js"></script>
<script type="text/javascript" src="js/wow.min.js"></script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment