cssのall属性を使用するにはどうすればよいですか?-CSSチュートリアル-php.cn

cssのall属性を使用するにはどうすればよいですか?

青灯夜游

リリース： 2019-05-25 15:26:29

オリジナル

3402 人が閲覧しました

all 属性は、unicode-bidi および方向を除くすべての属性を初期値または親要素から継承された値にリセットするために使用されます。

cssのall属性を使用するにはどうすればよいですか?

CSS all プロパティ

all プロパティは、実際にはすべての CSS プロパティの略語であり、次のことを意味します。 all CSS プロパティは同じですが、unicode-bidi と Direction の 2 つの CSS プロパティは含まれません。

関数: all 属性は、unicode-bidi と方向を除くすべての属性をリセットします。

構文:

all: initial|inherit|unset;

ログイン後にコピー

initial: 要素または要素の親に適用されるすべてのプロパティを初期値に変更します。

inherit: 要素または要素の親に適用されるすべてのプロパティをその親の値に変更します。

unset: 要素または要素の親に適用されるすべてのプロパティをその親の値に変更します (if継承可能である場合）、または初期値に変更されます（継承不可能な場合）。

注: Internet Explorer および Safari ブラウザは、all 属性をサポートしません。

#CSS のすべての属性を使用する例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style> 
html {
  font-size: small;
  color: blue;
}
p{
font-size: 20px;
color: #000;
}
#ex1 {
  background-color: yellow;
  color: red;
}
#ex2 {
  background-color: yellow;
  color: red;
  all: inherit;
}
#ex3 {
  background-color: yellow;
  color: red;
  all: initial;
}
#ex4 {
  background-color: yellow;
  color: red;
  all: unset;
}
</style>
</head>
<body>
<p>没有设置all 属性:</p>
<div id="ex1">PHP中文网！！！</div>
<p>all: inherit:</p>
<div id="ex2">PHP中文网！！！</div>
<p>all: initial:</p>
<div id="ex3">PHP中文网！！！</div>
<p>all: unset:</p>
<div id="ex4">PHP中文网！！！</div>
</body>
</html>

ログイン後にコピー

レンダリング:

cssのall属性を使用するにはどうすればよいですか?