CSS mask-size ਪ੍ਰਤੀਯੋਗਤਾ ਵਿਸ਼ੇਸ਼ਤਾ

ਪਿਛਲਾ ਪੰਨਾ mask-repeat
ਅਗਲਾ ਪੰਨਾ mask-type

ਕੋਰਸ ਸਿਫਾਰਸ਼:

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ mask-size

ਗੁਣ ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਦਾ ਮਾਪ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ。

ਇਨਸਟੈਂਸ਼

ਉਦਾਹਰਣ 1

ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਦਾ ਮਾਪ (ਪਿਕਸਲ ਦੇ ਰੂਪ ਵਿੱਚ) ਸੈਟ ਕਰੋ:
  .mask1 {
  -webkit-mask-image: url(w3logo.png);
  ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਦਾ ਮਾਪ (ਪ੍ਰਤੀਸ਼ਤ ਦੇ ਰੂਪ ਵਿੱਚ) ਸੈਟ ਕਰੋ:
  mask-size: 200px 200px;
mask-repeat: no-repeat;

}

mask-size: 70%;

ਉਦਾਹਰਣ 2

ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਦਾ ਮਾਪ (ਪਿਕਸਲ ਦੇ ਰੂਪ ਵਿੱਚ) ਸੈਟ ਕਰੋ:
  .mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 200px 200px;
mask-repeat: no-repeat;

}

ਸਵੈਲਰ ਕਰੋ

CSS ਗਰੇਫਿਕਸਿਜ਼ਿਓਨਲ ਲੇਵਲ 1

mask-size: auto|size|contain|cover|initial|inherit;

ਗੁਣ ਮੁੱਲ	ਮੁੱਲ
ਮੂਲਤਬੀ ਮੁੱਲ:	ਵਰਣਨ
ਮੂਲਤਬੀ ਮੁੱਲ	size
ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਦਾ ਮਾਪ ਨਿਰਧਾਰਿਤ ਕਰੋ, ਜਿਸ ਵਿੱਚ px, em ਵਰਗੇ ਇਕਾਈਆਂ ਵਰਤੀਆਂ ਜਾ ਸਕਦੀਆਂ ਹਨ ਜਾਂ % ਵਰਤੀ ਜਾ ਸਕਦੀ ਹੈ。	contain
ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਨੂੰ ਸਕੇਲ ਕਰੋ ਤਾਕਿ ਇਸ ਦੀ ਚੌਡਾਈ ਅਤੇ ਉਚਾਈ ਕੰਟੇਨਰ ਦੇ ਅੰਦਰੂਨੀ ਨਾਲ ਮੈਚ ਕਰ ਸਕੇ।	cover
ਇਸ ਗੁਣ ਨੂੰ ਉਸ ਦੇ ਮੂਲਤਬੀ ਮੁੱਲ 'ਤੇ ਸੈਟ ਕਰੋ। ਦੇਖੋ:	ਕੈਪਚਰ ਮਾਸਕ ਚਿੱਤਰ ਨੂੰ ਸਕੇਲ ਕਰੋ ਤਾਕਿ ਇਸ ਦੀ ਚੌਡਾਈ ਅਤੇ ਉਚਾਈ ਕੰਟੇਨਰ ਨੂੰ ਕਵਰ ਕਰ ਸਕੇ। ਇਸ ਗੁਣ ਨੂੰ ਉਸ ਦੇ ਮੂਲਤਬੀ ਮੁੱਲ 'ਤੇ ਸੈਟ ਕਰੋ। ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧੀ ਗੁਣ
ਆਪਣੇ ਮਾਤਾ ਤੱਤ ਤੋਂ ਇਸ ਗੁਣ ਨੂੰ ਇਨਹਿਰਿਟ ਕਰੋ। ਦੇਖੋ:	initial ਆਪਣੇ ਮਾਤਾ ਤੱਤ ਤੋਂ ਇਸ ਗੁਣ ਨੂੰ ਇਨਹਿਰਿਟ ਕਰੋ। ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧੀ ਗੁਣ

inherit

ਤਕਨੀਕੀ ਵੇਰਵੇ	ਮੂਲਤਬੀ ਮੁੱਲ:
auto	ਇਨਹਿਰਿਟੈਂਸੀ:
ਨਹੀਂ	ਐਨੀਮੇਸ਼ਨ ਨਿਰਮਾਣ:ਸਮਰਥਨ ਨਹੀਂ ਹੈ। ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧੀ ਗੁਣ
。	ਵਰਸਨ:
ਜਾਵਾਸਕ੍ਰਿਪਟ ਗਰੇਫਿਕਸਿਜ਼ਿਓਨਲ ਲੇਵਲ 1	object.style.maskSize="100px 200px"