新しいフォルダ

日々の備忘録を書いています。

HTMLで、画像が拡大表示された時の話

Web

HTML,CSSをVSCodeで書いてた時に、画像が拡大表示された時の話です。

 

技術的な話でもなんでもないので

この記事を見て解決する方は、ほぼ居ないと思いますが

こういう人も居るんだ笑…程度に読んで下さい。

 

解決する為に、ググる事 約2時間

一通りの解決策を、色々拝見して実行してみましたが解決せず。

 

外部CSSファイルに問題があるのかなぁと

新規でHTMLファイルを作って「画像だけ」載っけてみる。

「width="" height=""」も指定せず。

こちらは、意図した通りに表示される…。

 

 

 

なんで？？と、今日は諦めようと思った時

 

 

 

あれ？

 

ブラウザは、Brave

 

 

 

 

書き方云々の話じゃなかった。

【アダプティブデザイン】PHPでデバイス別に読み込むHTMLファイルを切り替える方法

Web

JavaScriptを使用して、

クライアントサイドで処理する方法もあるけど

ここでは割愛。

 

以下は、PHPを使用してサーバーサイドで処理する方法。

※前提として、サーバーでPHPが使える事。

 

index.php を用意する。

--------------------------------------------------

<?php

$userAgent = $_SERVER['HTTP_USER_AGENT'];

if (preg_match('/Mobile|Android|iPhone/', $userAgent)) {
    include('./mobile.html');
} elseif (preg_match('/Tablet|iPad/', $userAgent)) {
    include('./tablet.html');
} else {
    include('./pc.html');
}


?>

 

--------------------------------------------------

 

includeの内容を適宜書き換えて完了。