252 lines
5.1 KiB
Vue
252 lines
5.1 KiB
Vue
<template>
|
||
<view class="page">
|
||
<u-navbar :is-back="true" title='识图' title-color="#000" :border-bottom="false" :background="bgc"
|
||
id="navbar">
|
||
</u-navbar>
|
||
|
||
<view class="top_page">
|
||
<view class="title">凤尾竹</view>
|
||
<view class="other_name">
|
||
又名：花海
|
||
</view>
|
||
<view class="cont">
|
||
<view class="cont_left">
|
||
<view class="cont_left_tit">
|
||
难易程度
|
||
</view>
|
||
<view class="cont_left_txt">
|
||
非常容易
|
||
</view>
|
||
<view class="cont_left_tit" style="margin-top: 40rpx;">
|
||
功能
|
||
</view>
|
||
<view class="cont_left_txt">
|
||
吸甲醛、净化空气、美观
|
||
</view>
|
||
<view class="cont_left_tit" style="margin-top: 40rpx;">
|
||
适合空间
|
||
</view>
|
||
<view class="cont_left_txt">
|
||
办公桌、书房、客厅、户外
|
||
</view>
|
||
</view>
|
||
<view class="cont_right">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/u5qEV0STfGCLxtW06R0g" mode=""></image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bot_page">
|
||
<view class="tit" style="margin-top: 0rpx;">
|
||
养护重点
|
||
</view>
|
||
<view class="txt">
|
||
1、喜欢散光环境，耐寒力差，幼苗忌霜冻喜肥沃酥
|
||
松土壤。
|
||
2、适宜生长环境温度在10C到25C之间
|
||
3、不喜水 土壤干后加水一般十天左右
|
||
</view>
|
||
</view>
|
||
<view class="about">
|
||
<view class="tit">
|
||
关于
|
||
</view>
|
||
<view class="cont">
|
||
凤尾竹（Bambusa multiplex (Lour.) Raeusch.
|
||
ex Schult. 'Fernleaf' R. A. Young）是禾本科，簕
|
||
竹属孝顺竹的变种。植株较高大，杆高可达6米，竿
|
||
中空，小枝、稍下弯，下部挺直，绿色；竿壁稍薄；
|
||
节处稍隆起，无毛；叶鞘无毛，纵肋稍隆起，背部
|
||
具脊；叶耳肾形，边缘具波曲状细长繸毛；叶舌圆拱
|
||
形，叶片线形，上表面无毛，下表面粉绿而密被短柔
|
||
毛，小穗含小花，中间小花为两性；外稃两侧稍不对
|
||
称，长圆状披针形，先端急尖；内稃线形，脊上被短
|
||
纤毛，花药紫色，子房卵球形，羽毛状。成熟颖果未
|
||
见。原产中国，华东、华南、西南以至台湾、香港均
|
||
有栽培。该种观赏价值较高，宜作庭院丛栽，也可作
|
||
盆景植物。（概述图参考来源：中国自然标本馆）
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
bgc: {
|
||
backgroundColor: "#fff",
|
||
},
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
|
||
},
|
||
methods: {
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
/deep/ .u-title{
|
||
margin-bottom: 22rpx;
|
||
}
|
||
/deep/ .uicon-nav-back{
|
||
margin-bottom: 22rpx;
|
||
}
|
||
.about{
|
||
margin-top: 56rpx;
|
||
padding: 0 32rpx;
|
||
box-sizing: border-box;
|
||
.tit{
|
||
font-size: 40rpx;
|
||
color: #3D3D3D;
|
||
font-weight: 600;
|
||
}
|
||
.cont{
|
||
margin-top: 24rpx;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
.activesc{
|
||
background-color: #999 !important;
|
||
}
|
||
.shouc {
|
||
width: 100%;
|
||
padding: 0rpx 100rpx;
|
||
box-sizing: border-box;
|
||
position: fixed;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
bottom: 80rpx;
|
||
text-align: center;
|
||
text {
|
||
display: inline-block;
|
||
width: 200rpx;
|
||
background-color: #3dada9;
|
||
color: #fff;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
text-align: center;
|
||
border-radius:50rpx;
|
||
}
|
||
}
|
||
|
||
.container {
|
||
width: 100%;
|
||
height: 100vh;
|
||
background-color: #fff;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
padding-top: 50rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
|
||
page {
|
||
padding-bottom: 200rpx;
|
||
box-sizing: border-box;
|
||
background: #fff;
|
||
}
|
||
|
||
.top_page {
|
||
background: #fff;
|
||
padding: 0 32rpx;
|
||
padding-bottom: 28rpx;
|
||
|
||
.title {
|
||
margin-top: 23rpx;
|
||
font-size: 80rpx;
|
||
// font-weight: 400;
|
||
letter-spacing: 0rpx;
|
||
line-height: 88rpx;
|
||
color: rgba(80, 86, 90, 1);
|
||
}
|
||
|
||
.other_name {
|
||
margin-top: 8rpx;
|
||
font-size: 40rpx;
|
||
letter-spacing: 0rpx;
|
||
line-height: 48rpx;
|
||
color: rgba(119, 128, 141, 1);
|
||
}
|
||
|
||
.cont {
|
||
margin-top: 82rpx;
|
||
margin-bottom: 28rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: flex-start;
|
||
|
||
.cont_left {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
// margin-right: 40rpx;
|
||
// align-items: baseline;
|
||
width: 50%;
|
||
|
||
.cont_left_tit {
|
||
font-size: 28rpx;
|
||
// font-weight: 400;
|
||
letter-spacing: 0.56rpx;
|
||
line-height: 36rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.cont_left_txt {
|
||
margin-top: 10rpx;
|
||
width: 294rpx;
|
||
font-size: 32rpx;
|
||
// font-weight: 600;
|
||
letter-spacing: 0.64rpx;
|
||
line-height: 40rpx;
|
||
color: #50565A;
|
||
|
||
}
|
||
}
|
||
|
||
.cont_right {
|
||
width: 320rpx;
|
||
height: 320rpx;
|
||
margin-right: 20rpx;
|
||
box-sizing: border-box;
|
||
image {
|
||
background-size: cover;
|
||
border-radius: 50%;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
}
|
||
|
||
.bot_page {
|
||
padding: 23rpx 32rpx 0rpx 32rpx;
|
||
|
||
.tit {
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
letter-spacing: 0rpx;
|
||
line-height: 40rpx;
|
||
color:#48893B;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.txt {
|
||
// margin-top: 24rpx;
|
||
width: 100%;
|
||
margin-top: 12rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
letter-spacing: 0.64rpx;
|
||
line-height: 40rpx;
|
||
color:#48893B;
|
||
|
||
}
|
||
}
|
||
</style> |