<template>
	<view>
		<!-- #ifdef H5 -->
			<view class="head-box">
				<view class="head-logo">
					<navigator url="#" class="logo"></navigator>
				</view>
				<view class="head-nav uni-flex">
					<view>
						<navigator url="#">首页</navigator>
					</view>
					<view>
						<navigator url="#">目的地</navigator>
					</view>
					<view>
						<navigator url="#">旅游攻略</navigator>
					</view>
					<view>
						<navigator url="#">去旅行</navigator>
					</view>
					<view>
						<navigator url="#">机票火车</navigator>
					</view>
					<view>
						<navigator url="#">订酒店</navigator>
					</view>
					<view>
						<navigator url="#">社区</navigator>
					</view>
					<view>
						<navigator url="#">APP</navigator>
					</view>
					<view>
						<navigator url="#" class="nav-logo"></navigator>
					</view>
				</view>
			</view>
		
		<!-- #endif -->
	</view>
</template>

<script>
	export default {
		name:"index-header",
		data() {
			return {
				list:[
					{title:'首页'}
				]
			};
		}
	}
</script>

<style lang="scss">
	@media (min-width:1440px) {
		.head-box{
			height: 62px;
			.head-logo{
					.logo{
						// width: 120px;
						height: 39px;
						background: url(../../static/header/header-sprites15.png)no-repeat 0 0 ;
					}
			}
		}
		.head-nav{
			view{
				line-height: 62px;
			}
			.nav-logo{
				height: 68px;
			}
		}
		
	}
	@media (max-width:1440px) {
		.head-box{
			height: 58px;
			.head-logo{
				.logo{
					width: 120px;
					height: 33px;
					background: url(../../static/header/header-small-sprites3.png)no-repeat 0 0 ;
				}
			}
			.head-nav{
				view{
					line-height: 62px;
				}
				.nav-logo{
					height: 58px;
				}
			}
		}
		
	}
	.head-box{
		background-color: pink;
		width: 1200px;
		margin: 0 auto;
		.head-logo{
			padding: 12px 13px;
			float: left;
			width: 136px;
		}
		.head-nav{
			height: 100%;
			display: flex;	
			padding: 0 10px;
			font-size: 14px
			;
			view{
				padding: 0 16px;
			}
			.nav-logo{
				background: url(../../static/header/mfwzx.png)no-repeat center;			background-size: 75px 30px;
				width: 75px;
			}
		}
	}
	
</style>
