|
发表于 2017-5-26 15:27:47
|
显示全部楼层
+ F! X6 B: ] C( i5 s" T P3 M* c
不知是否是这样的效果(见图):
* x5 G' {4 x$ K- ~$ I# Y9 P竖图0 ]4 y+ b# M& {) |5 V# Z
2 Y8 K; c% p! t! R4 C/ n. Z1 M! A
# l, s7 y4 k1 K+ |3 d$ j
" v% y$ q% X( I* N横图1 I6 X6 c# s( P3 Z$ y. \
/ Z# V$ ?8 i; C6 W% s5 Z& d) x% M m" p( r* Y1 J8 N: q
2 R* @7 f) x1 @
用css来显示区域的大小.% y7 y8 m' a- F
首先要知道图片的大小. 在同一套卡片的所有图片的大小最好大致相当. 取个适当的大小值.- t; X P# G, o2 v8 M& \6 W' s- B! q
比如竖图像素为: 552 x 1250
9 I. @; d- P' E7 [. F用css显示比图像大小要大的区域. 假设为 600 x 1280
- S% E0 `1 d* [8 U' P(取小了, 图片会自动缩小.)
7 D% O: i/ E. r. t8 s8 [. `! |: @8 A% l8 B" e
1, 在Styling区内后面加上css:8 n. D/ j' ~2 W, m: t; I" u; O, Y+ I
0 g; s: L, K8 j.img{width:600px;height:1280px;}
/ m- ~9 `3 \0 d" y) d& P- @( A3 [! G- k( j
2, 在Back Template区的字段加上标签.2 ^2 A% m9 R8 H, G2 G4 N
比如原来的字段为:! J' H1 B1 K4 y3 A' Y ^' v
{{Back}}/ m7 E# W- j N
# q5 x+ p z3 ^' d加上之后为:7 L: w& A; x' Z' E" Q; l
<div class="img">{{Back}}</div>9 Y( c) [ o& c
- x) p$ A" {* @1 H& \) `9 b; d) C4 s
效果就是Anki的答案区的图片显示区域为: 600 x 1280像素了.
- v$ O0 L2 F/ \- _7 m! Z. I5 x% f# t9 g; O" ?7 j; O' L
/ a8 F! M0 |- e
如果横图为: 1250 x 552: o. B0 m9 z8 y: P# ?9 x! U
则为:
6 c6 M" S/ n3 Q% m5 C& i8 ].img{width:1280px;height:600px;}
9 Q- n( P4 s+ E, a) Q% ^# D! ]/ q
/ b+ G9 [, \( n: J( l, e% S, P
如果设置为:) \: k% o9 P5 f- f2 f. ?
.img{width:1280px;height:1280px;}
' L1 ~0 O5 o; i- a% l# M那么显示区域会很大, 在下就不知道如何设置图片居中了.
8 P* K# C: q+ r- [ r M" \7 ?5 D. G# \- w
适逢有用, 偶然所得. 希望没有理解错误.
5 h2 r( B( s j/ T* J+ ` |
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?免费注册
x
|