CSS ::before ప్రత్యార్థక అంశం

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

CSS ::before ప్రత్యార్థకం ప్రత్యేక పేజీ పరిణామం ముందు కొన్ని సమాచారాన్ని ప్రవేశపెట్టడానికి ఉపయోగిస్తారు.

ఉపయోగించండి content ప్రత్యార్థకం లోని సమాచారం నిర్దేశిస్తాయి. content యొక్క విలువలు కనీసం ఇలా ఉండాలి:

  • పదబంధం: content: "హలో వరల్డ్!";
  • చిత్రం: content: url(myimage.jpg);
  • సమాచారం లేకపోవడం: content: none;
  • కౌంటర్: content: counter(li);
  • కోవ్వులు: content: open-quote;
  • అంశపు విలువలు: content: " (" attr(href) ")";

సూచన:ప్రత్యార్థకం లోని ప్రవేశపెట్టబడిన సమాచారం ఇక్కడికే ఉంటుంది. ప్రవేశపెట్టబడిన సమాచారం ఇతర సమాచారానికి ముందు జతకలిపబడుతుంది.

ఉపయోగించండి ::after ప్రత్యేక పేజీ పరిణామం తర్వాత కొన్ని పదబంధాలను ప్రవేశపెట్టండి.

ప్రత్యార్థకం

ఉదాహరణ 1

ప్రత్యేక పేజీ పరిణామం ముందు ఒక పదబంధాన్ని ప్రవేశపెట్టండి:

p::before {
  content: "ఈ వాక్యాన్ని చదవండి: ";
}

పరీక్షించండి

ఉదాహరణ 2

ప్రత్యేక పేజీ పరిణామం ముందు ఒక పదబంధాన్ని ప్రవేశపెట్టండి మరియు ప్రవేశపెట్టబడిన పదబంధం స్టైల్స్ అమర్చండి:

p::before {
  content: "ఈ వాక్యాన్ని చదవండి -";
  background-color: yellow;
  color: red;
  font-weight: bold;
}

పరీక్షించండి

CSS సంకేతాలు

::before {
  క్లాస్ డిక్లరేషన్స్;
}

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

వెర్షన్: CSS2

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

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

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
4.0 9.0 3.5 3.1 7.0

సంబంధిత పేజీలు

పాఠ్యం:CSS ప్రత్యార్థక అంశం

సూచనలు:CSS ::after ప్రత్యార్థక అంశం