スタイル属性 (element.style) で定義されたインラインスタイルを削除する方法

Magento を頻繁に変更する場合、element.style に遭遇することがあります。これは style.css よりも優先されます。したがって、CSS を変更しても効果はありません。レベルを element.style を超えるにはどうすればよいですか? ぜひご利用ください！重要

CSS プロパティ値の後に ! を追加します。重要。優先度がelement.styleを超えています

HTML に CSS を適用する方法は 3 つあります。

インライン<br />インラインスタイルは、style 属性を通じて HTML に直接挿入されます。

次のようになります:

コードをコピー

コードは次のとおりです。

これにより、指定された段落が赤色に変わります。

HTML はスタンドアロンでスタイルフリーのドキュメントであるべきであり、可能な限りインラインスタイルを避けることをお勧めします。

内部<br />内部スタイルは現在のページ全体に適用されます。 head タグ内の style タグには、現在のページのすべてのスタイルが含まれます。

次のようになります:

コードをコピー

コードは次のとおりです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>CSS の例</title> <style type="text/css"> p { color: red; } a { color: blue; } </style> ...

これにより、このページのすべての段落が赤くなり、すべてのリンクが青になります。

インラインスタイルと同様に、HTML ドキュメントを CSS ドキュメントから分離する必要があります。ここで、救いの手が…

外部<br />外部スタイルは、Web サイト全体の複数のページに使用されます。これは独立した CSS ドキュメントです。簡単な例は次のとおりです。

コードをコピー

コードは次のとおりです。

p { 色: 赤; } a { 色: 青; }

このドキュメントを「web.css」として保存すると、次のように HTML ドキュメントにリンクできます。

コードをコピー

コードは次のとおりです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<ヘッド>
<title>CSS の例</title>
<link rel="stylesheet" type="text/css" href="web.css" /> ...

CSS アドバンスガイドでは外部スタイルシートをリンクする他の方法についても説明しますが、今のところはこれで十分です。

このガイドをさらに活用するには、テキストエディターで新しいドキュメントを作成し、コードを「web.css」として HTML ドキュメントと同じディレクトリに保存してみてください。

次に、HTML ドキュメントを次のように改善します。

コードをコピー

コードは次のとおりです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>私の最初の Web ページ</title> <link rel="stylesheet" type="text/css" href="web.css" /> </head> ...

HTML ドキュメントを保存します。これで HTML と CSS がリンクされましたが、まだ空白のままで何も変更されていません。 CSS 初心者ガイドを進めていくと、CSS ドキュメントに追加や変更を加えたり、以前と同じようにブラウザで HTML ドキュメントを更新したりして、その効果を簡単に確認できるようになります。

<<: テキストエリアの残りの単語数を動的に取得する方法

>>: MySQL セキュリティ管理の詳細