PR
言語切り替え

type属性を省略したinput要素のWordPressにおける外観

Wordpress

テキストボックスの外観の矛盾

WordPressでコードエディタを使用してブログを作成していた。そして以下の二つのコードの結果が異なることに気付いた。調べてもわからなかったので試行錯誤してみた。

・通常のテキストボックス

<input type="text">

・type属性を省略したinput要素

<input>

あなたの環境では異なる結果かもしれないので一応下にスクリーンショットを載せておく。

input要素のtype属性はデフォルトではtextであるようだ。そのため上記の二つは同じ外観になるはずである。

上記の写真はChromeの結果である。ブラウザが違えば結果は異なるのではと思った。

・Microsoft Edgeの場合

・Braveの場合

またアンドロイドでどうなるかを試した(ブラウザはChrome)。

いずれも同じような結果となった。

原因はWordpressのテーマ

原因はWordpressのテーマだった。現在このサイトはCocoon Childを使用している。これをいくつかに変えてみた。

まずは日本で人気の無料テーマCocoon。変わらない。

次にAstra。変化はない。

次に海外でも人気の2025。

二つのボックスは全く一緒となった。

少し試しただけであるが、Wordpressテーマの影響があるのではないかという結論に至った。

コメント