બટન HTML href સાથે સંબંધિત મુખ્ય સમસ્યા એ છે કે વિવિધ બ્રાઉઝર્સમાં સુસંગત દેખાય તે રીતે બટનને સ્ટાઇલ કરવું મુશ્કેલ બની શકે છે. વધુમાં, એક href એટ્રિબ્યુટ સાથે એન્કર ટેગનો ઉપયોગ કરતી વખતે, લિંક એ જ વિન્ડોમાં ડિફૉલ્ટ રૂપે ખુલશે, જે ચોક્કસ પ્રકારની લિંક્સ માટે ઇચ્છનીય ન હોઈ શકે. અંતે, જો href એટ્રિબ્યુટ યોગ્ય રીતે ગોઠવેલ નથી, તો બટન પર ક્લિક કરવાથી ભૂલ પૃષ્ઠમાં પરિણમી શકે છે.
<button><a href="">Click Here</a></button>
1. કોડની આ લાઇન HTML માં બટન તત્વ બનાવે છે.
2. બટન એલિમેન્ટની અંદર, ખાલી href એટ્રિબ્યુટ સાથે એન્કર ટેગ છે.
3. એન્કર ટેગમાં "અહીં ક્લિક કરો" લખાણ છે.
HREF ની વ્યાખ્યા
HREF નો અર્થ હાયપરટેક્સ્ટ રેફરન્સ છે અને તે HTML એટ્રિબ્યુટ છે જેનો ઉપયોગ હાઇપરલિંકને વ્યાખ્યાયિત કરવા માટે થાય છે. તેનો ઉપયોગ એક પૃષ્ઠને બીજા પૃષ્ઠ સાથે લિંક કરવા માટે થાય છે, ક્યાં તો તે જ વેબસાઇટ પર અથવા બીજી વેબસાઇટ પર. HREF એટ્રિબ્યુટ લિંકના ગંતવ્યને નિર્દિષ્ટ કરે છે અને અન્ય HTML ઘટકો સાથે ઉપયોગ કરી શકાય છે જેમ કે , , અને
.શું હું બટન HTML માં HREF નો ઉપયોગ કરી શકું છું
ના, HTML માં બટન એલિમેન્ટમાં href એટ્રિબ્યુટનો ઉપયોગ કરવો શક્ય નથી. બટન તત્વ href એટ્રિબ્યુટને સપોર્ટ કરતું નથી. જો કે, તમે બટન પર ક્લિક ઇવેન્ટ લિસનર ઉમેરવા માટે JavaScript નો ઉપયોગ કરી શકો છો જે ક્લિક કરવામાં આવે ત્યારે વપરાશકર્તાને અલગ પૃષ્ઠ પર લઈ જશે.
તમે એક href ને બટન તરીકે કેવી રીતે સ્ટાઈલ કરશો
HTML માં બટન તરીકે એન્કર ટેગને સ્ટાઇલ કરવા માટે, તમે નીચેના કોડનો ઉપયોગ કરી શકો છો:
પછી તમારી સ્ટાઇલશીટમાં નીચેની CSS ઉમેરો:
.બટન {
પૃષ્ઠભૂમિ-રંગ: #4CAF50; /* લીલા */
સરહદ: કંઈ નહીં;
રંગ: સફેદ;
ગાદી: 15PX 32PX;
ટેક્સ્ટ-ગોઠવણી: કેન્દ્ર;
ટેક્સ્ટ-ડેકોરેશન: કંઈ નહીં;
પ્રદર્શન: ઇનલાઇન-બ્લોક; ફોન્ટ-સાઇઝ: 16px; માર્જિન: 4px 2px; કર્સર: નિર્દેશક;}