CSS :target 伪类

నిర్వచనం మరియు ఉపయోగం

CSS :లక్ష్యం ప్రత్యామ్నాయ క్లాస్‌స్ ఉపయోగించడం ద్వారా ప్రస్తుత కార్యకలాపక లక్ష్యం యొక్క స్టైల్‌ని అమర్చండి.

సలహా:హాట్ మార్కర్ తో ముగించిన యూఆర్ఎల్ మరియు అంకుర పేరు, పత్రంలోని ప్రత్యేక అంశానికి లింక్ చేస్తుంది. లింక్ చేసిన అంశం లక్ష్యం అంశం.

ఇన్స్టాన్స్

ఉదాహరణ 1

ప్రస్తుత కార్యకలాపక లక్ష్యం యొక్క స్టైల్‌ని అమర్చండి:

:లక్ష్యం {
  బార్డర్: 2పిక్సెల్ సోలిడ్ డార్క్ ఓరాంజ్;
  బ్యాక్గ్రౌండ్-కలర్: బేజ్;
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 2

ఒక టాబ్ మెనూ సృష్టించండి:

.tab div {
  డిస్ప్లే: నాన్;
}
.tab div:లక్ష్యం {
  డిస్ప్లే: బ్లాక్;
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 3

ఒక మోడల్ బాక్స్ (డైలాగ్) సృష్టించండి:

/* మోడల్ బాక్స్ యొక్క బ్యాక్గ్రౌండ్ */
.modal {
  డిస్ప్లే: నాన్;
  లెఫ్ట్: 0;
  టాప్: 0;
  వెడల్పు: 100%;
  పరిమాణం: 100%;
  ఓవర్ఫ్లో: ఆటో;
  బ్యాక్గ్రౌండ్-కలర్: ఆర్బిజి(0, 0, 0);
  బ్యాక్గ్రౌండ్-కలర్: ఆర్బిజి(0, 0, 0, 0.4);
}
/* లక్ష్యంగా చూడబడే మోడల్ బాక్స్ చూపించండి */
.modal:లక్ష్యం {
  డిస్ప్లే: టేబుల్;
  స్థానం: అబ్సోల్యూట్;
}
/* మోడల్ బాక్స్ */
.modal-dialog {
  డిస్ప్లే: టేబుల్-సెల్;
  వెర్టికల్-అలాయిన్: మిడిల్;
}
/* మోడల్ బాక్స్ యొక్క కంటెంట్ */
.modal-dialog .modal-content {
  మార్గం: ఆటో;
  బ్యాక్గ్రౌండ్-కలర్: #f3f3f3;
  స్థానం: రెలేటివ్;
  ప్యాడింగ్: 0;
  ఆఉట్లైన్: 0;
  బార్డర్: 1పిక్సెల్ #777 సోలిడ్;
  టెక్స్ట్-అలాయిన్: జస్టిఫై;
  వెడల్పు: 80%;
  బాక్స్-షడో: 0 4పిక్సెల్స్ 8పిక్సెల్స్ 0 ఆర్బిజి(0, 0, 0, 0.2), 0 6పిక్సెల్స్ 20పిక్సెల్స్ 0 ఆర్బిజి(0, 0, 0, 0.19);
}

స్వయంగా ప్రయత్నించండి

CSS సంకేతాలు

:లక్ష్యం {
  సిఎస్ఎస్ నిర్వచనాలు;
}

సాంకేతిక వివరాలు

బ్రౌజర్ మద్దతు

పద్ధతిలోని సంఖ్యలు ఈ ప్రత్యామ్నాయ క్లాస్‌స్‌ను పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ వెర్షన్‌ని నిర్దేశిస్తాయి.