Embedding Media audio iyo video HTML

HTML waa luuqad awood leh oo lagu dhiso bogag shabakad, waana luuqad lagu daro waxyaabo badan oo ku saabsan warbaahinta sida maqalka iyo muuqaalka. Labada tag ee muhiimka ah ee loo isticmaalo in lagu daro waxyaabahaas waa <audio> iyo <video>. Cashirkan, waxaan ku sharxi doonaa sida saxda ah ee loo adeegsado labadan tag iyo sidii aad ugu dari lahayd maqalka iyo muuqaalka boggaaga si toos ah.

Tag-ga <audio>

Embedding Media  audio iyo video HTML
 Embedding Media  audio iyo video HTML


Tag-ga <audio> waxaa loo isticmaalaa in lagu daro waxyaabaha maqalka ee boggaaga. Waxaad soo bandhigi kartaa faylasha maqalka adigoo adeegsanaya qaabab kala duwan sida MP3, OGG, iyo WAV. Waxaa jira saddex astaamood oo muhiim ah oo tag-ga <audio> la socda: controls, autoplay, iyo loop.

Qaabka Guud:

html

<audio controls> <source src="file.mp3" type="audio/mpeg"> Browserkaagu ma taageero maqalkan. </audio>

Sharaxaad:

  • controls: Astaantan waxay soo bandhigaysaa badhanno user-ka uu ku maamuli karo maqalka, sida "Play", "Pause", iyo "Volume".
  • source: Waxa uu tilmaamayaa faylka maqalka iyo nooca faylkaas, sida MP3 ama OGG.
  • Haddii browser-ka uusan taageerin tag-ga <audio>, fariin ayaad u diri kartaa user-ka.

Tag-ga <video>

Sida tag-ga <audio>, tag-ga <video> wuxuu kuu ogolaanayaa inaad ku darto muuqaal boggaaga. Waxa uu sidoo kale leeyahay astaamo la mid ah kuwa maqalka sida controls, autoplay, iyo loop. Waxaa lagu dari karaa noocyo kala duwan sida MP4 iyo WebM.

Qaabka Guud:

html

<video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> Browserkaagu ma taageero muuqaalkan. </video>

Sharaxaad:

  • width iyo height: Waxay tilmaamayaan cabbirka muuqaalka.
  • controls: Waxay soo bandhigtaa badhanno lagu maamulo muuqaalka.
  • source: Waxay tilmaamaysaa faylka muuqaalka iyo nooca faylka, sida MP4 ama WebM.

Astaamo Dheeraad Ah:

  1. Autoplay: Waxaad adeegsan kartaa autoplay si maqalka ama muuqaalka uu u bilaabo isla marka bogga la furo, laakiin waa in aad ogaataa in badankood browser-yada ay hakiyaan autoplay si ay user-ka u siiyaan xakamayn.

    html

    <audio autoplay> <source src="song.mp3" type="audio/mpeg"> </audio>
  2. Loop: Haddii aad rabto in muuqaalka ama maqalka uu soo noqnoqdo, waxaad adeegsan kartaa astaanta loop.

    html

    <video loop> <source src="movie.mp4" type="video/mp4"> </video>
  3. Poster: Waxa kale oo aad isticmaali kartaa astaanta poster oo ah sawir laga soo bandhigi karo ka hor inta muuqaalka la bilaabin.

    html

    <video width="320" height="240" controls poster="thumbnail.jpg"> <source src="video.mp4" type="video/mp4"> </video>

Xusuusin:

Waxaa muhiim ah in aad isticmaasho faylalka maqalka iyo muuqaalka ee noocyo kala duwan leh, sida OGG iyo MP3 ama MP4 iyo WebM, si aad u hubiso in boggaagu si fiican ugu shaqeynayo browser-yada kala duwan. Tusaale ahaan, qaababka faylalka maqalka iyo muuqaalka ayaa kala duwanaan kara marka loo eego browser-ka uu user-ku adeegsanayo, sida Chrome, Firefox, ama Safari.

Gabagabo:

Tag-ga <audio> iyo <video> waxay qayb muhiim ah ka yihiin HTML-ga casriga ah, waxaana loo adeegsan karaa si sahlan oo wax ku ool ah si aad ugu darto waxyaabo warbaahineed boggaaga shabakadda. Isku day inaad isticmaasho tags-kan si aad ugu dari karto qaabab kala duwan oo warbaahin ah, taasoo boggaaga ka dhigeysa mid soo jiidasho leh oo waxtar leh.

Previous Post Next Post