CSS માં, તમે તમારા વેબ પૃષ્ઠ પર તત્વો પસંદ કરી શકો છો class
, અને શૈલીઓ લાગુ કરી શકો છો અને ઘટકોને કસ્ટમાઇઝ કરી શકો છો. id
તેનો ઉપયોગ કેવી રીતે કરવો તેની વિગતવાર માર્ગદર્શિકા અહીં છે:
તત્વો પસંદ કરી રહ્યા છીએ
ચોક્કસ HTML ઘટકના તમામ ઉદાહરણો પસંદ કરવા માટે, પસંદગીકાર તરીકે તત્વ નામનો ઉપયોગ કરો. ઉદાહરણ તરીકે, દસ્તાવેજમાંના p
તમામ ટૅગ્સ પસંદ કરે છે. <p>
પસંદ કરી રહ્યા છીએ Class
સમાન વર્ગ સાથે તત્વો પસંદ કરવા માટે, "" ડોટનો ઉપયોગ કરો. વર્ગનું નામ અનુસરે છે. ઉદાહરણ તરીકે, .my-class
વર્ગ સાથેના તમામ ઘટકો પસંદ કરે છે my-class
.
બહુવિધ વર્ગો સાથે તત્વો પસંદ કરવા માટે, બિંદુઓનો ઉપયોગ કરો "." અને જગ્યાઓ દ્વારા અલગ કરેલ વર્ગના નામોની યાદી બનાવો. ઉદાહરણ તરીકે, .class1.class2
બંને class1
અને class2
વર્ગો સાથે તત્વો પસંદ કરે છે.
પસંદ કરી રહ્યા છીએ id
ચોક્કસ તત્વને તેના દ્વારા પસંદ કરવા માટે id
, હેશ "#" ને અનુસરતા તત્વનો ઉપયોગ કરો id
. ઉદાહરણ તરીકે, #my-id
સાથે તત્વ પસંદ કરે છે id
my-id
.
Element
, Class
, અને ID
પસંદગીઓનું સંયોજન
તમે class
ચોક્કસ વર્ગો અને ID
.
ઉદાહરણ તરીકે, અને સાથે તત્વ div.my-class#my-id
પસંદ કરે છે. <div>
class my-class
ID
my-id
અહીં ઘટકો પસંદ કરવાનું ચોક્કસ ઉદાહરણ છે, class
અને id
CSS માં:
/* Select all <p> tags */
p {
color: blue;
}
/* Select elements with the class "my-class" */
.my-class {
background-color: yellow;
}
/* Select the element with the ID "my-id" */
#my-id {
font-weight: bold;
}
/* Combine element, class, and ID selections */
div.my-class#my-id {
border: 1px solid black;
}
element
, , અને id પસંદગીનો ઉપયોગ કરીને class
, તમે તમારા વેબ પેજ પર ચોક્કસ ઘટકો અથવા તત્વોના જૂથોને સરળતાથી પસંદ કરી શકો છો અને શૈલી બનાવી શકો છો.