質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Android

Androidは、Google社が開発したスマートフォンやタブレットなど携帯端末向けのプラットフォームです。 カーネル・ミドルウェア・ユーザーインターフェイス・ウェブブラウザ・電話帳などのアプリケーションやソフトウェアをひとつにまとめて構成。 カーネル・ライブラリ・ランタイムはほとんどがC言語/C++、アプリケーションなどはJavaSEのサブセットとAndroid環境で書かれています。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

2回答

1550閲覧

Androidでscaleが効かない

mai24451

総合スコア14

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Android

Androidは、Google社が開発したスマートフォンやタブレットなど携帯端末向けのプラットフォームです。 カーネル・ミドルウェア・ユーザーインターフェイス・ウェブブラウザ・電話帳などのアプリケーションやソフトウェアをひとつにまとめて構成。 カーネル・ライブラリ・ランタイムはほとんどがC言語/C++、アプリケーションなどはJavaSEのサブセットとAndroid環境で書かれています。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/08/06 05:21

前提・実現したいこと

Androidにてcssのscaleが効きません。
5つの画像があり、それぞれ
transform: scale(.6);
transform: scale(1);
transform: scale(.4);
など設定しております。

iOSであれば、画像が縮小されることは確認できているのですが、Androidですと全ての画像が同じサイズとなってしまいます。
回避策などあれば教えていただきたいです。

該当のソースコード

css

1.swiper-slide > img { 2 width: 70vw; 3} 4 5.swiper-slide-prev { 6 -webkit-transform:scale(.6); 7transform: scale(.6); 8 opacity: .8; 9 bottom: 15vh; 10}

補足情報(FW/ツールのバージョンなど)

Androidバージョン 7.0
ブラウザ、chrome共に同じ挙動です。

足りない情報がございましたら追記いたします。
何卒宜しくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

自己解決

ご回答ありがとうございました。
ご指摘いただいた方法でもcssが効いていなかった為、imgの大きさを直接サイズ設定する運びとなりました。
ありがとうございました。

投稿2020/08/12 05:13

mai24451

総合スコア14

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

私はandroid9ですが、自分のやつで  transform: scale 使ってますが、chromeで正常に表示されてまして、Can I use?で調べても、どちらも対応にはなってましたね。

それでちょっと思ったのですが、

transform: scale(.6); transform: scale(1); transform: scale(.4);

この各()内の数値の書き方がどうなのでしょうか?
普通は、上から 0.6 1.0 0.4 という書き方をするのですが、なぜあえて0を外されてるのかがわからないのですが、とりあえず一度0を入れてやってみられたらどうでしょうか?

投稿2020/08/07 06:53

mari.rinn

総合スコア296

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問