CSS బేసిక్ సింహాసనం

CSS సింహాసనం

CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。

selector {declaration1; declaration2; ... declarationN }

选择器通常是您需要改变样式的 HTML 元素。

ప్రతి అనునామా ఒక అట్రిబ్యూట్ మరియు విలువ నుండి నిర్మించబడుతుంది.

అటువంటి స్టైల్ అట్రిబ్యూట్లను మీరు అనుకొనుట ఉంటుంది. ప్రతి అట్రిబ్యూట్కు ఒక విలువ ఉంటుంది. అట్రిబ్యూట్ మరియు విలువ కుడి మూలలో కొరకు సెకాన్స్ ఉంటుంది.

selector {property: value}

ఈ కోడ్ పంక్తి ద్వారా, h1 ఎలమెంట్లలోని వచనాలను ఎరుపు రంగులోని మధ్యన నిలబడే పేరాన్ని నిర్వచించడానికి మరియు ఫాంట్ సైజ్ను 14 పిక్సెల్స్ గా నిర్వచించడానికి ఉపయోగించబడుతుంది.

ఈ ఉదాహరణలో, h1 అనేది సెలెక్టర్, color మరియు font-size అనేవి అటువంటి స్టైల్ అట్రిబ్యూట్లు, red మరియు 14px అనేవి విలువలు.

h1 {color:red; font-size:14px;}

ఈ చిత్రం పైన ఉన్న కోడ్ నిర్మాణాన్ని చూపిస్తుంది:

CSS సింహాసనం

సూచన:అనునామాలను చుట్టి పెట్టండి.

విలువల వివిధ రూపాలు మరియు ఇ్యూనిట్లు

రెడ్ అనే ఆంగ్ల పదం కాకుండా, #ff0000 అనే హెక్సాడెసిమల్ రంగు విలువను కూడా ఉపయోగించవచ్చు:

p { color: #ff0000; }

బెట్టలు పొందడానికి, సిఎస్ఎస్ సంక్షిప్త రూపాన్ని ఉపయోగించవచ్చు:

p { color: #f00; }

RGB విలువలను రెండు విధాలుగా ఉపయోగించవచ్చు:

p { color: rgb(255,0,0); }
p { color: rgb(100%,0%,0%); }

చూపించండి, RGB ప్రతిసారి శతకం లోపల ఉండాలి. అయితే, ఇతర పరిస్థితుల్లో ఇది అవసరం కాదు. ఉదాహరణకు, పరిమాణం 0 పిక్సెల్స్ ఉన్నప్పుడు, 0 తర్వాత px ఇ్యూనిట్లు ఉపయోగించకుండా ఉండాలి, ఎందుకంటే 0 పిక్సెల్స్ అనేది పిక్సెల్స్ యొక్క ఇ్యూనిట్ లేదు మరియు ఇతర ఇ్యూనిట్లు లేవు:

టాగులు పెట్టడాన్ని మనవిచారించండి:

సూచన:అనునామా అనేక పదాలుగా ఉంటే, అనునామాకు కొరకు టాగులు పెట్టాలి:

p {font-family: "sans serif";}

బహుళ అనునామాలు:

సూచన:నాలుగు అనునామాలను నిర్వచించడానికి, ప్రతి అనునామాను స్వయంగా మూసివేయాలి. ఈ ఉదాహరణలో, ఎరుపు రంగులోని మధ్యన నిలబడే పేరాన్ని నిర్వచించడానికి ఉపయోగించబడుతుంది. చివరి నిబంధన మూసివేయకుండా ఉండాలి, ఎందుకంటే స్వయంగా మూసివేయడం ఆంగ్లంలో విభజకం కాదు మరియు ముగింపు కాదు. అయితే, అనుభవమున్న డిజైనర్లకు ప్రతి అనునామా ముగింపుకు స్వయంగా మూసివేయడం లాభదాయకం అవుతుంది. దీని ప్రభావం ఈ విధంగా ఉంటుంది:

p {text-align:center}; color:red;}

你应该在每行只描述一个属性，这样可以增强样式定义的可读性，就像这样：

p {
  text-align: center;
  color: black;
  font-family: arial;
}

空格和大小写

大多数样式表包含不止一条规则，而大多数规则包含不止一个声明。多重声明和空格的使用使得样式表更容易被编辑：

body {
  color: #000;
  background: #fff;
  margin: 0;
  padding: 0;
  font-family: Georgia, Palatino, serif;
  }

是否包含空格不会影响 CSS 在浏览器的工作效果，同样，与 XHTML 不同，CSS 对大小写不敏感。不过存在一个例外：如果涉及到与 HTML 文档一起工作的话，class 和 id 名称对大小写是敏感的。