Cara mengatur posisi video di html

Oke teman-teman silahkan simak penjelasan berikut ini tentang cara paling mudah menampilkan video dan menjalankannya pada html(browser).

Membuat Pemutar Video Dengan HTML5

nah, apa saja nih yang kita butuhkan ? yang pertama adalah file video nya. kalau file video nya gak ada apa yg mau di tampilin, ya gak teman-teman. hehe.

jadi video nya di letakkan pada directory yang sama dengan file html. jika tidak teman-teman bisa mengaturnya dengan ” ../ ” jika videnya berada di luar folder. dan “namafolder/” jika file video nya berada di dalam sebuah folder lain.perhatikan pada gambar di bawah.

Cara mengatur posisi video di html

menampilkan video dengan html

index.html

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<!DOCTYPE html>

<html>

<head>

<title>Membuat Pemutar video Dengan HTML5 | www.malasngoding.com</title>

<style type="text/css">

h1{

font-family: sans-serif;

}

</style>

</head>

<body>

<h1>

Membuat Pemutar video Dengan HTML5<br/>

www.malasngoding.com

</h1>

<video width="400px" height="350px" controls>

<source src="mov_bbb.mp4" type="video/mp4">

<source src="mov_bbb.ogg" type="video/ogg">

</video>

 

</body>

</html>

seperti yang teman-teman lihat pada syntax di atas. video di tampilkan dengan element video milik html5. di tulisa dengan di awali tag <video> pembuka dan tag </video> penutup. ukurannya bisa teman-teman sesuaikan dengan keinginan masing-maing. dan jangan lupa tambahkan controls pada tag video pembuka. untuk membuat control pada video nya seperti tombol start, pause dan lain-lainnya.

dan coba jalankan pada browser.

Cara mengatur posisi video di html

memutar video dengan html

sekian lah cara mudah memutar video dengan html5. semoga dapat bermanfaat. terima kasih sudah berkunjung ke www.malasngoding.com.

Incoming search terms:

  • cara memutar video di html
  • cara membuat pemutar video di html
  • cara menampilkan video di html
  • cara menampilkan video di php
  • mengupload video dengan html malasngoding com
  • cara membuka video format html
  • tutorial menampilkan video dengan php
  • html pemutar video
  • pemutar video html
  • mmembuat pemutaran video malasngoding


  • SHARE :

Diki Alfarabi Hadi

Coding enthusiast. Someone who love learn something new. especially about web programming and web design. happy to share about knowledge and learn from other.

  • Author's profile
  • All posts by Diki Alfarabi Hadi

Tags: cara memutar video dengan html5, cara menampilkan video dengan html5, memutar video pada website dengan html5, pemutar video, video html5

Tutorial HTML Dasar

  • #1. Pengertian HTML
  • #2. Memilih Text Editor
  • #3. Mengenal Tag, Element dan Atribut
  • #4. Mengenal Heading HTML
  • #5. Format Text HTML
  • #6. Paragraf HTML
  • #7. Membuat Tabel HTML
  • #8. Link / Hyperlink HTML
  • #9. List HTML
  • #10. Format Code
  • #11. Form HTML
  • #12. Atribut Form HTML
  • #13. Simbol HTML
  • #14. Menampilkan Gambar HTML
  • #15. Iframe HTML
  • #16. Menghubungkan HTML dan CSS
  • #17. Mengenal Class dan Id
  • #18. Baris Baru (Tag BR)

Tutorial HTML Lanjutan

  • #1. Favicon
  • #2. Pemutar Video HTML
  • #3. Tutorial HTML Lainnya

Produk

  • Cara mengatur posisi video di html
    Source Code Website Reservasi Kamar Hotel Dengan PHP dan MySQLi Rp 200,000
  • Cara mengatur posisi video di html
    Source Code Aplikasi Pengajuan Cuti Karyawan Berbasis Website Rp 200,000
  • Cara mengatur posisi video di html
    Source Code Toko Sport PHP dan MySQLi Rp 200,000
  • Cara mengatur posisi video di html
    Source Code Sistem Informasi Kuesioner Berbasis Web Rp 200,000

Tutorial Terbaru

  • Tutorial Python # 13 : Jenis Operator Pada Python September 24, 2022
  • Membuat Laporan PDF Dengan PHP dan MySQLi September 3, 2022
  • Export Data ke Excel Dengan PHP dan MySQLi August 23, 2022
  • Membuat Select Option Dinamis Menggunakan Ajax August 17, 2022
  • Membuat QR Code Dengan PHP August 3, 2022

Toko Kami

Cara mengatur posisi video di html
Cara mengatur posisi video di html
Cara mengatur posisi video di html

SOCIAL

Malas Ngoding

TUTORIAL MENARIK LAINNYA

Cara mengatur posisi video di html

HTML

Menampilkan PDF Di HTML Dengan Mudah

12 August 2020

Selamat datang kembali di website malasngoding.com. Pada materi tutorial ini kita akan belajar tentang cara menampilkan file PDF di HTML di Website. Seperti yang kita ketahui, ...

Diki Alfarabi Hadi

Cara mengatur posisi video di html

HTML

Membuat Game Snake Dengan HTML5 dan JQuery

14 May 2017

Membuat Game Snake Dengan HTML5 dan JQuery – Selamat datang di tutorial cara membuat game dengan html5. seperti pada judul tutorial ini, kita akan membahas ...

Diki Alfarabi Hadi

Cara mengatur posisi video di html

HTML

Membuat Baris Baru atau Enter di HTML

10 April 2017

Membuat Baris Baru atau Enter di HTML – hai teman-teman semuanya apakabar ? assalamualaikum.. kembali lagi di www.malasngoding.com. situs penyedia tutorial-tutorial seputar pemrograman yang berkualitas ...

Diki Alfarabi Hadi

Cara mengatur posisi video di html

CSS - HTML

Cara Disable Resize Form Textarea Dengan CSS

31 March 2017

Selamat datang kembali di www.malasngoding.com. situs yang fokus membahas tentang tutorial pemograman web, mobile dan desktop. Sesuai dengan judul “Cara Disable Resize Form Textarea Dengan ...