CSS3 で transform を使用した場合のフォントぼかしの解決方法の詳細な説明

CSS3 で transform を使用した場合のフォントぼかしの解決方法の詳細な説明

この質問は非常に奇妙なので、あまり多くを語らずにコードに直接進みます。

.g-ダイアログラッパー{
    位置: 固定;
    上位: 50%;
    左: 50%;
    変換: translate(-50%, -50%);

    ディスプレイ: フレックス;
    flex-direction: 列;
    幅: 405ピクセル;
    背景色: #ffffff;
    高さ: 226px;
    -webkit-box-shadow: 0 0 2em #5191f1;
    -moz-box-shadow: 0 0 2em #5191f1;
    ボックスシャドウ: 0 0 2em #5191f1;
    境界線の半径: 3px;
    zインデックス: 9999;
  }

上記の CSS スタイルにより、ページのフォントがぼやけてしまいます。

這里寫圖片描述

ネットで調べたところ、ブラウザのレンダリングに問題があるようです。transform の値はベースとして設定できませんが、ベースではないことを明確に述べました。

変換: translate(-50%, -50%);

後でいくつか変更を加えて、幅と高さを偶数に変更しました。

幅: 404ピクセル;
高さ: 226px; 

這里寫圖片描述

CSS3 で transform を使用したときにフォントがぼやける問題を解決する方法についての記事はこれで終わりです。CSS3 で transform を使用したときにフォントがぼやける問題の詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

<<:  MySQLが数十億のトラフィックをサポートする方法

>>:  JavaScript イベント委任の原則

推薦する

MySQLデータをOracleに移行する正しい方法

mysql データベースには student テーブルがあり、その構造は次のとおりです。 Oracl...

Zabbixは複数のmysqlプロセスの監視を実装します

1 つのサーバー上で 3 つの MySQL インスタンス プロセスが開始され、それぞれ異なるポート ...

docker createコマンドの使用方法

docker create コマンドは、イメージに基づいてコンテナを作成できます。このコマンドの効果...

Vue+ElementUI で超大規模なフォーム例を処理する方法

最近、社内の業務調整により、以前の超長文のロジックが大幅に変更されたため、リファクタリングする予定で...

vue3 コンポーネントでの v-model の使用と詳細な説明

目次v-model 入力で双方向バインディングデータを使用するコンポーネント内の v-model他の...

MySQL 8.0.11 MacOS 10.13 のインストールと設定方法のグラフィックチュートリアル

MacにMySQLデータベースをインストールし、環境変数を設定する手順を参考までに記録します。具体的...

相同性とクロスドメイン、jsonp(関数カプセル化)、CORS原則の詳細な分析

目次同一起源ポリシーAjax リクエストの制限: Ajaxは自身のサーバーにのみリクエストを送信でき...

タブ切り替えを実装するための HTML サンプル コード

タブ切り替えもプロジェクトではよく使われる技術です。一般的にタブ切り替えはjsやjqを使って実装され...

ウェブサイトデザインに関するヒント

実は、最近はウェブデザインについてよく耳にするようになりました。インターネット業界は今とても発展して...

システムメンテナンスページにリダイレクトするように nginx を設定する

先週末、兄弟プロジェクトはより良いサービスを提供するためにサーバーを拡張する準備をしていました。兄弟...

MySQLカバーインデックスの利点

一般的な提案は、WHERE 条件のインデックスを作成することですが、これは実際には一方的です。インデ...

Docker メモリ監視とストレステストの方法

起動していたDockerコンテナはメモリを使い果たした状態になっており、再起動せずにコンテナのメモリ...

Windows 10にOdoo12開発環境をインストールする方法

序文多くの友人は Mac コンピューターを持っていないと言っていますが、Windows 開発は実際に...

document.getElementBy系メソッドがオブジェクトを取得できない問題を解決する

getElementByIdはオブジェクトを取得できませんブラウザがドキュメントを解析するときにはシ...

MySQLで日付と時刻を照会する方法

序文:プロジェクト開発では、一部のビジネス テーブル フィールドで日付と時刻の型が使用されることが多...