XAMMPでHTMLファイルの文字化けを直したい

XAMMPのhtdocs folder内に[php_test]フォルダを作成して、その中に[from.html]を
作成しました。
HTTP://localhost/php_test/で検索して、from.htmlファイルを開くと文字化けしてしまいます。

例）
蜈･蜉帙ヵ繧ｩ繝ｼ繝
譁咏炊蜷�: 繧ｫ繝・ざ繝ｪ:
驕ｸ謚槭＠縺ｦ縺上□縺輔＞
蜥碁｣�
荳ｭ闖ｯ

なんとか解決できないでしょうか？
それともHTMLファイルはXAMPPでは正常に動かないのでしょうか？
教えて頂きたく質問いたしました。
ご回答よろしくお願いします。

【試したこと】
・調べて文字コードがApache,Mysql,php.iniで違うとのことで設定した。

【apache】
設定前
;mbstring.language = Japanese
;mbstring.internal_encoding = EUC-JP
;mbstring.http_input = auto
;mbstring.http_output = SJIS
;mbstring.encoding_translation = Off
;mbstring.detect_order = auto
;mbstring.substitute_character = none
;mbstring.func_overload = 0

↓
設定後
mbstring.language = Japanese
mbstring.internal_encoding = UTF-8
mbstring.http_input = auto
mbstring.http_output = UTF-8
mbstring.encoding_translation = On
mbstring.detect_order = auto
mbstring.substitute_character = none
mbstring.func_overload = 0

【Mysql】

設定後
シャープシャープ UTF 8 Settings
init-connect=SET NAMES utf8
collation_server=utf8_unicode_ci
character_set_server=utf8
skip-character-set-client-handshake
character_sets-dir="C:/xampp/mysql/share/charsets"

[client]
シャープ password = your_password
port = 3306
socket = "C:/xampp/mysql/mysql.sock"
default-character-set = utf8

[mysqldump]
quick
max_allowed_packet = 16M
default-character-set = utf8

[mysql]
no-auto-rehash
シャープ Remove the next comment character if you are not familiar with SQL
シャープsafe-updates
default-character-set = utf8

【php.ini】
[default character]
; PHP's default character set is set to empty.
; http://php.net/default-charset
;default_charset = "iso-8859-1"
default_charset = UTF-8

[Date]
; Defines the default timezone used by the date functions
; http://php.net/date.timezone
;date.timezone=Europe/Berlin
date.timezone=Asia/Tokyo

[mbstring]
; language for internal character representation.
; http://php.net/mbstring.language
;mbstring.language = Japanese
mbstring.language = Japanese

; internal/script encoding.
; Some encoding cannot work as internal encoding.
; (e.g. SJIS, BIG5, ISO-2022-*)
; http://php.net/mbstring.internal-encoding
;mbstring.internal_encoding = EUC-JP
mbstring.internal_encoding = UTF-8

長々とすみません。
現在のapacheとmysqlとphp.iniの設定で変更した部分を記載しました。

何卒宜しくお願い致します。

行動規範の内容に同意します

回答2件

おはようございます。そもそもHTMLファイルをUTF-8で保存する。
単純なHTMLをブラウザで開いてみて文字化けするかどうかだと思います。
この時点でPHPファイルを呼び出していないのでXAMPPの設定・PHPの設定
をみてもあまり変化がないかと・・。

ただし

前の方の

HTML
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4<meta_charset="utf-8">

の部分でよろしいかとおもいますが・・。

投稿2020/04/30 19:25

退会済みユーザー

総合スコア0

takochi

2020/05/01 02:52

ありがとうございます。 HTMLファイルのみブラウザで開いた所、文字化けしないで表示されました。

退会済みユーザー

2020/05/01 03:00

わたしもテスト用にxamppを使っていますがUTF-8で保存するようになってから問題なく表示されます。あとは、Webブラウザのデフォルトエンコードを確かめてみるとかでしょうか・・。 Shift-JIS、JIS、EUC-JPのいずれかでないかなど。（HTMLファイルのみで文字化けしないのは標準のブラウザと開発用のブラウザの設定が違うとか？？あまりくわしくないのでわかりませんが）

退会済みユーザー

2020/05/01 03:12

ブラウザが古い場合、HTML５に対応していないため下記の記述が必要なようです・・。 <meta http-equiv="content-type" content="text/html; charset=UTF-8">

takochi

2020/05/01 03:16

調べて頂きありがとうございます。 VScodeで試した所、正常に動きました。

行動規範の内容に同意します

ベストアンサー

（書いてなければ）以下を加えてみてはどうですか？

HTML
1<html>
2<head>
3  ...
4  <meta charset="UTF-8">
5  ...
6</head>
7...

投稿2020/04/30 17:40

編集2020/04/30 17:42

mktia

総合スコア110

takochi

2020/04/30 17:52

ご回答ありがとうございます。確認したところ、その部分の記述がありました。他に可能性があれば教えて頂けると幸いです。 htmlの内容を記載いたします。 <!DOCTYPE html> <html lang="ja"> <head> <meta_charset="utf-8"> <title>入力フォーム</title> </head> <body> 入力フォーム<br> <form method="post" action="receive.php"> 料理名:<input type="text" name="recipe name" required> <input type="submit" value="送信"> カテゴリ: <select_name = "kategory"> <option value = " ">選択してください</option> <option value = "1">和食</option> <option value = "2">中華</option> <option value = "3">洋食</option> </select> </form> </body> </html>