使用ion-slides
时,我遇到了布局问题。我正在使用此HTML代码创建一个简单的卡片:
<ion-header>
<ion-navbar>
<ion-title style="text-align:center;">Title</ion-title>
</ion-navbar>
</ion-header>
<ion-content class="tutorial-page">
<ion-card>
<ion-card-content>
<ion-card-title style="color:#000000;text-align:center;padding-top:10px; font-size: 24px; font-weight: bold;">
Title
</ion-card-title>
</ion-card-content>
</ion-card>
</ion-content>
理所当然地导致了这个: Correct display of card
但是当我尝试将此卡嵌入ion-slides
时,宽度很奇怪。它在风景上看起来很好,看起来有一些固定的宽度。我无法弄清楚如何使它在肖像中工作。代码在这里:
<ion-header>
<ion-navbar>
<ion-title style="text-align:center;">Title</ion-title>
</ion-navbar>
</ion-header>
<ion-content class="tutorial-page">
<ion-slides>
<ion-slide>
<ion-card>
<ion-card-content>
<ion-card-title style="color:#000000;text-align:center;padding-top:10px; font-size: 24px; font-weight: bold;">
Title
</ion-card-title>
</ion-card-content>
</ion-card>
</ion-slide>
</ion-slides>
</ion-content>
结果如下所示: Strange width
这里有CSS:.tutorial-page {
.toolbar-background {
background: #fff;
border-color: transparent;
}
.slide-zoom {
width: 100%;
height: 100%;
}
.slide-title {
margin-top: 2.8rem;
}
.slide-image {
max-height: 50%;
max-width: 60%;
margin: 18px 0;
}
b {
font-weight: 500;
}
p {
padding: 0 40px;
font-size: 14px;
line-height: 1.5;
color: #60646B;
b {
color: #000000;
}
}
}
感谢我能得到的任何帮助, 安德烈
答案 0 :(得分:2)
自己找到解决方案......
我在一些css文件中有一些片段:
Function FindDepotMemo() As String
Dim Path As String
Dim FindFirstFile As String
Path = "G:\BUYING\Food Specials\2. Planning\1. Planning\1. Planner\" & "*." & " " & Year(Date) & "\"
FindFirstFile = Dir$(Path & "*.xlsx")
While (FindFirstFile <> "")
If InStr(FindFirstFile, "Planner") > 0 Then
FindDepotMemo = Path & FindFirstFile
Exit Function
End If
FindFirstFile = Dir
Wend
End Function
作为Ionic的初学者,我认为css文件与每个页面分开。所以我把这段代码放在其他页面上,显然影响了它。此外,对css文件进行更改并不总是重新加载UI。