Maboti ya Makutano ya Kifungu cha CSS

Maboti ya Makutano ya Kifungu cha CSS

outline-color Hakika ina mpangilio wa rangi ya outline.

Inaupelea kwa mpangilio wote hivi:

  • name - kusaidia jina la rangi, kama 'red'
  • HEX - kusaidia taarifu hex, kama '#ff0000'
  • RGB - kusaidia RGB values, kama 'rgb(255,0,0)'
  • HSL - kusaidia HSL values, kama 'hsl(0, 100%, 50%)'
  • invert - kufanya uharibifu wa rangi (kuingatia kwamba outline inavyopatikana, bila ya rangi ya mabasi ya bandia yoyote)

Mifano inayotunza kwa rangi mbalimbali na mimeza ya outline. Tafadhali, vitu hivi vinapatikana kwenye border ya kifungu cha kijani:

outline na mabidi ya kichwa kichwa.

outline na mabidi ya kijani.

outline na kifungu cha kijani.

Mifano

p.ex1 {
  border: 2px solid black;
  outline-style: solid;
  outline-color: red;
}
p.ex2 {
  border: 2px solid black;
  outline-style: dotted;
  outline-color: blue;
}
p.ex3 {
  border: 2px solid black;
  outline-style: outset;
  outline-color: grey;
}

Tafuta Kufanya Kupitia

HEX values

Inaupelea kwa kutumia taarifu hex (HEX) kuhakikisha rangi ya outline:

Mifano

p.ex1 {
  outline-style: solid;
  outline-color: #ff0000; /* red */
}

Tafuta Kufanya Kupitia

RGB values

aupeleza kwa kutumia RGB values:

Mifano

p.ex1 {
  outline-style: solid;
  outline-color: rgb(255, 0, 0); /* red */
}

Tafuta Kufanya Kupitia

HSL Values

Unaweza kutumia HSL Values:

Mifano

p.ex1 {
  outline-style: solid;
  outline-color: hsl(0, 100%, 50%); /* Red */
}

Tafuta Kufanya Kupitia

Unaweza kuwaona Maboti ya CSS Maktaba ya kitabu hii inaongea zaidi kuhusu HEX, RGB na HSL Values.

kuzindua kwa rangi

Mifano hii inatumia outline-color: invert，kumaliza kuzindua kwa rangi. Hii inakadhihisha kwamba kama rangi ya msingi ni gani, outline ni inayopatikana:

Outline ya rangi ya kuzindua kwa mabaya.

Mifano

p.ex1 {
  border: 1px solid yellow;
  outline-style: solid;
  outline-color: invert;
}

Tafuta Kufanya Kupitia