CSS border-top-left-radius ਪ੍ਰਾਪਰਟੀ
- ਪਿਛਲੀ ਪੰਨਾ border-top-color
- ਅਗਲਾ ਪੰਨਾ border-top-right-radius
ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ
border-top-left-radius ਗੁਣ ਖੱਬੇ ਉੱਪਰੀ ਕੋਣ ਦੇ ਬਰਾਉਂਡਰ ਦੀ ਆਕਾਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ。
ਸੁਝਾਅ:ਇਹ ਗੁਣ ਤੁਹਾਨੂੰ ਐਲੀਮੈਂਟ ਨੂੰ ਗੋਲਾਕਾਰ ਬਰਾਉਂਡਰ ਜੋੜਨ ਦੀ ਇਜਾਜਤ ਦਿੰਦਾ ਹੈ。
ਹੋਰ ਦੇਖੋ:
CSS3 ਸਿੱਖਿਆCSS3 ਬਾਰਡਰ
ਉਦਾਹਰਣ
div ਐਲੀਮੈਂਟ ਦੇ ਖੱਬੇ ਉੱਪਰੀ ਕੋਣ ਨੂੰ ਗੋਲਾਕਾਰ ਬਰਾਉਂਡਰ ਜੋੜੋ:
div
{
border:2px solid;
border-top-left-radius:2em;
}
CSS ਗਰੈਫਿਕਸ
border-bottom-right-radius: length|% [length|%];
ਟਿੱਪਣੀ:border-top-left-radius ਗੁਣ ਦੇ ਲੰਬਾਈ ਮੁੱਲ ਅਤੇ ਪ੍ਰਤੀਸ਼ਤੀ ਮੁੱਲ ਚਾਰ ਤਿਹਾਈ ਦੌਰੇ (ਬਾਹਰੀ ਬਰਾਉਂਡਰ ਦੇ ਕੋਣ ਦੀ ਆਕਾਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੇ ਹਨ) ਦੇ ਦੂਰੀ (radii) ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੇ ਹਨ। ਪਹਿਲਾ ਮੁੱਲ ਹੋਰਤੱਲ ਦੂਰੀ ਹੈ, ਦੂਜਾ ਮੁੱਲ ਲੰਬਾਈ ਦੂਰੀ ਹੈ। ਜੇਕਰ ਦੂਜਾ ਮੁੱਲ ਛੱਡ ਦਿੱਤਾ ਗਿਆ ਤਾਂ ਪਹਿਲਾ ਮੁੱਲ ਦੋਹਾਂ ਦੇ ਤੌਰ 'ਤੇ ਦੁਹਰਾਇਆ ਜਾਵੇਗਾ। ਜੇਕਰ ਲੰਬਾਈ ਦੂਰੀ ਜੋੜ ਦਿੱਤੀ ਗਈ ਤਾਂ ਕੋਣ ਚੌਕੀ ਹੋਵੇਗੀ ਨਾ ਕਿ ਗੋਲਾ ਹੋਵੇਗਾ। ਹੋਰਤੱਲ ਦੀ ਪ੍ਰਤੀਸ਼ਤੀ ਦੂਰੀ ਬਰਾਉਂਡਰ ਬਕਸ ਦੇ ਚੌਡਾਈ ਨੂੰ ਦਰਸਾਉਂਦੀ ਹੈ, ਜਦਕਿ ਲੰਬਾਈ ਦੀ ਪ੍ਰਤੀਸ਼ਤੀ ਦੂਰੀ ਬਰਾਉਂਡਰ ਬਕਸ ਦੀ ਉੱਚਾਈ ਨੂੰ ਦਰਸਾਉਂਦੀ ਹੈ。
ਗੁਣ ਮੁੱਲ
| ਮੁੱਲ | ਵਰਣਨ | ਟੈਸਟ |
|---|---|---|
| length | ਪ੍ਰਤੀਸ਼ਤੀ ਨਾਲ ਘੱਟ ਹੱਥ ਦੀ ਆਕਾਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰੋ。 | ਟੈਸਟ |
| % | ਪ੍ਰਤੀਸ਼ਤੀ ਨਾਲ ਘੱਟ ਹੱਥ ਦੀ ਆਕਾਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰੋ。 | ਟੈਸਟ |
ਤਕਨੀਕੀ ਵੇਰਵੇ
| ਮੂਲ ਮੁੱਲ: | 0 |
|---|---|
| ਵਿਰਾਸਤੀਕਰਣ: | no |
| ਵਰਜਨ: | CSS3 |
| JavaScript ਗਰੈਫਿਕਸ: | object.style.borderTopLeftRadius="5px" |
ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ
ਸਾਰੇ ਪੱਤਰਾਂ ਵਿੱਚ ਦਿਖਾਈ ਵਾਲੇ ਨੰਬਰ ਇਹ ਪਹਿਲੇ ਬਰਾਉਜ਼ਰ ਹਨ ਜਿਹੜੇ ਇਸ ਗੁਣ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਦੇ ਹਨ。
| ਚਰੋਮੇ | IE / ਐਜ਼ | ਫਾਇਰਫਾਕਸ | ਸਫਾਰੀ | ਓਪਰਾ |
|---|---|---|---|---|
| 5.0 4.0 -webkit- |
9.0 | 4.0 3.0 -moz- |
5.0 3.1 -webkit- |
10.5 |
- ਪਿਛਲੀ ਪੰਨਾ border-top-color
- ਅਗਲਾ ਪੰਨਾ border-top-right-radius
