weex - Android 原生Vue.js 使用 justify-content: flex-end; 不起作用
高洛峰
高洛峰 2017-04-18 09:19:51
0
2
852

Android 原生,Vue.js 的属性 justify-content: flex-end; 外面套两层 <p>,就不起作用。备注:web 下是好的。

见代码:
<template>
<p class="page">

<p class="con">
    <p class="title">
        <text class="titleText">标题 ... ...</text>
    </p>
    <p class="validate">
        <text class="validateText">内容 ... ...</text>
    </p>
</p>

</p>
</template>
<style scoped>

.page {
    }
.con {    
    background-color:#CCCCCC;
    flex-direction: row;
}
.title{
    margin: 5px;
    flex-direction: column;
    justify-content: flex-end;
    background-color:#FFFFFF;
}
.titleText{
    font-size: 28px;
    background-color:red;
}

.validate{
    margin: 5px;        
    background-color:#CCCCCC;
    height: 100px;
    flex:1;
}
.validateText {    
    font-size: 24px;
    margin:5px;
}

</style>

高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

全員に返信(2)
左手右手慢动作

コードを見ると、「タイトル」を一番下に配置したいと思われます。まず、justify-content 属性は vue.js からのものではなく、Flexbox からのものです。次のように書いてみてください:

リーリー

複数の人に回答してもらいたい場合は、レンダリングを投稿することをお勧めします。

いいねを押す +0
巴扎黑

フレックスボックスのプロパティを使用するには、ディスプレイがフレックスである必要があります。そうでない場合は、display:block である必要があります

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート