网页中是如何插入视频的？
网站不同，操作大同小异，在如今网络上的信息量日渐膨胀的前提下，网站对数据信息的多样化和个性化设计也愈加的重视。多媒体技术逐渐发展和提高给在线展示的形式从视频、音频、PPT、图表等发展到视频中提供了条件。
今天讨论网页中插入视频的方案，咱不讨论video标签的使用方法，video标签比较兼容的写法为：
1 <video width="800" height=""> 2 <source src="myvideo.mp4" type="video/mp4"></source> 3 <source src="myvideo.ogv" type="video/ogg"></source> 4 <source src="myvideo.webm" type="video/webm"></source> 5 <object width="" height="" type="application/x-shockwave-flash" data="myvideo.swf"> 6 <param name="movie" value="myvideo.swf" /> 7 <param name="flashvars" value="autostart=true&file=myvideo.swf" /> 8 </object> 9 当前浏览器不支持 video直接播放，点击这里下载视频： <a href="myvideo.webm">下载视频</a>10 </video>
但是一般不会同一个视频生成MP4、ogg、webm和swf（flash）四种格式的视频，原因是太占用时间了。
讨论的第一种方案是：将视频上传到爱奇艺、优酷和腾讯等第三方视频网站上，在使用第三方网站提供的代码（在视频下方的“分享”按钮中即可找到），具体测试代码为：
1 <!DOCTYPE html> 2 <html lang="zh"> 3 4 <head> 5 <meta charset="UTF-8" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 7 <meta http-equiv="X-UA-Compatible" content="ie=edge" /> 8 <title>网页中插入视频的方法</title> 9 <style type="text/css">10 * {11 margin: 0;12 padding: 0;13 }14 15 body {16 text-align: center;17 }18 19 div {20 font-size: 18px;21 color: #2E8DED;22 margin-top: 20px;23 }24 </style>25 </head>26 27 <body>28 <!--爱奇艺视频（无通用代码） 只支持PC端 IE8以上都可以-->29 <div>30 爱奇艺视频（无通用代码） 只支持PC端 IE8以上都可以31 </div>32 <embed src="http://player.video.qiyi.com/8b89d9c3ec3535c93ceaded663cc91c2/0/0/v_19rr7zq9xw.swf-albumId=715375800-tvId=715375800-isPurchase=0-cnId=25" allowFullScreen="true" quality="high" width="480" height="350" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>33 <div>34 腾讯视频 全部支持 IE8以上都可以35 </div>36 <!--腾讯视频 全部支持 IE8以上都可以-->37 <iframe frameborder="0" width="640" height="498" src="https://v.qq.com/iframe/player.html?vid=p0521h3uu1a&tiny=0&auto=0" allowfullscreen></iframe>38 <div>39 优酷视频 全部支持 IE8以上都可以40 </div>41 <!--优酷视频 全部支持 IE8以上都可以-->42 <iframe height=498 width=510 src='http://player.youku.com/embed/XMjg2OTA1NDc5Mg==' frameborder=0 'allowfullscreen'></iframe>43 </body>44 45 </html>网页显示效果为：
需要说明的是：在第三方视频网站上分享代码中选择通用的代码，这样可以使得PC端和移动端均能良好的展现视频。
讨论的第二种方案是：使用ckplayer插件。
ckplayer插件的官网为：
官网上有在线配置功能，根据自己的需要进行配置，其中一个比较好测试代码为ckplayer调用html5播放器，
1 <!DOCTYPE html> 2 <html lang="zh"> 3 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <title>ckplayer调用html5播放器</title> 7 </head> 8 9 <body>10 <div id="a1"></div>11 <!--引入ckplayer.js-->12 <script type="text/javascript" src="ckplayer/ckplayer.js?1.1.11" charset="utf-8"></script>13 <script type="text/javascript">14 var flashvars = {15 //p参数为是否自动播放，可以为 1 或 0，默认为 1，参数不为 1 时播放器加载完成后均为暂停状态。16 p: 0,17 //e为视频结束后的动作，0 停止播放并发送js，1 是不发送 js 且重新循环播放，2 停止播放，默认为2。18 e: 1,19 //i为视频播放器初始图片地址，即封面图片，默认为空。20 i: ''21 };22 // 为视频地址23 var video = [';video/mp4'];24 var support = ['all'];25 //第一个100% 为宽度同样可以设置为像素，第二个100% 为高度同样可以设置为像素26 CKobject.embedHTML5('a1', 'ckplayer_a1', '100%', '100%', video, flashvars, support);27 </script>28 </body>29 30 </html>
PC效果为：
移动端效果为：
说明：视频只需要使用目前浏览器支持最多的MP4格式即可，需要处理的视频格式少。其次是使用ckplayer插件可以比较完美的兼容PC和移动端浏览器（经测试IE8 视频播放不了）。
总结：
优先建议将视频上传到第三方视频网站，兼容性好，同时视频加载快，不会占用网站服务器的带宽资源。
其次使用ckplayer插件在网页中插入本地视频。
Atas ialah kandungan terperinci 网页中是如何插入视频的？. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
AI Hentai Generator
Menjana ai hentai secara percuma.
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
Di manakah fail video disimpan dalam cache penyemak imbas?
Feb 19, 2024 pm 05:09 PM
Dalam folder manakah penyemak imbas menyimpan video tersebut Apabila kita menggunakan pelayar Internet setiap hari, kita sering menonton pelbagai video dalam talian, seperti menonton video muzik di YouTube atau menonton filem di Netflix. Video ini akan dicache oleh penyemak imbas semasa proses pemuatan supaya ia boleh dimuatkan dengan cepat apabila dimainkan semula pada masa hadapan. Jadi persoalannya, dalam folder manakah video yang dicache ini sebenarnya disimpan? Pelayar yang berbeza menyimpan folder video cache di lokasi yang berbeza. Di bawah ini kami akan memperkenalkan beberapa pelayar biasa dan mereka
Adakah ia melanggar untuk menyiarkan video orang lain di Douyin? Bagaimanakah ia mengedit video tanpa pelanggaran?
Mar 21, 2024 pm 05:57 PM
Dengan peningkatan platform video pendek, Douyin telah menjadi bahagian yang sangat diperlukan dalam kehidupan seharian setiap orang. Di TikTok, kita boleh melihat video menarik dari seluruh dunia. Sesetengah orang suka menyiarkan video orang lain, yang menimbulkan persoalan: Adakah Douyin melanggar apabila menyiarkan video orang lain? Artikel ini akan membincangkan isu ini dan memberitahu anda cara mengedit video tanpa pelanggaran dan cara mengelakkan isu pelanggaran. 1. Adakah ia melanggar penyiaran video orang lain oleh Douyin? Menurut peruntukan Undang-undang Hak Cipta negara saya, penggunaan tanpa kebenaran karya pemilik hak cipta tanpa kebenaran pemilik hak cipta adalah satu pelanggaran. Oleh itu, menyiarkan video orang lain di Douyin tanpa kebenaran pengarang asal atau pemilik hak cipta adalah satu pelanggaran. 2. Bagaimana untuk mengedit video tanpa pelanggaran? 1. Penggunaan domain awam atau kandungan berlesen: Awam
Bagaimana untuk membuang tera air video dalam Wink
Feb 23, 2024 pm 07:22 PM
Bagaimana untuk membuang tera air daripada video dalam Wink? Terdapat alat untuk membuang tera air daripada video dalam winkAPP, tetapi kebanyakan rakan tidak tahu bagaimana untuk membuang tera air daripada video dalam Wink dibawa oleh editor Teks tutorial, pengguna yang berminat datang dan lihat! Cara membuang tera air video dalam Wink 1. Buka APP wink dahulu dan pilih fungsi [Remove Watermark] di kawasan halaman utama 2. Kemudian pilih video yang ingin anda keluarkan watermark dalam album 3. Kemudian pilih video dan klik sudut kanan atas selepas mengedit video [√];4 Akhir sekali, klik [Pencetakan satu klik] seperti yang ditunjukkan dalam rajah di bawah dan kemudian klik [Proses].
Bagaimana untuk membuat wang daripada menyiarkan video di Douyin? Bagaimanakah seorang pemula boleh membuat wang di Douyin?
Mar 21, 2024 pm 08:17 PM
Douyin, platform video pendek kebangsaan, bukan sahaja membolehkan kami menikmati pelbagai video pendek yang menarik dan novel pada masa lapang kami, tetapi juga memberi kami pentas untuk menunjukkan diri kami dan merealisasikan nilai kami. Jadi, bagaimana untuk membuat wang dengan menyiarkan video di Douyin? Artikel ini akan menjawab soalan ini secara terperinci dan membantu anda menjana lebih banyak wang di TikTok. 1. Bagaimana untuk membuat wang daripada menyiarkan video di Douyin? Selepas menyiarkan video dan mendapat jumlah tontonan tertentu pada Douyin, anda akan berpeluang untuk mengambil bahagian dalam pelan perkongsian pengiklanan. Kaedah pendapatan ini adalah salah satu yang paling biasa kepada pengguna Douyin dan juga merupakan sumber pendapatan utama bagi banyak pencipta. Douyin memutuskan sama ada untuk menyediakan peluang perkongsian pengiklanan berdasarkan pelbagai faktor seperti berat akaun, kandungan video dan maklum balas khalayak. Platform TikTok membolehkan penonton menyokong pencipta kegemaran mereka dengan menghantar hadiah,
Cara menyiarkan video di Weibo tanpa memampatkan kualiti imej_Cara menyiarkan video di Weibo tanpa memampatkan kualiti imej
Mar 30, 2024 pm 12:26 PM
1. Mula-mula buka Weibo pada telefon mudah alih anda dan klik [Saya] di sudut kanan bawah (seperti yang ditunjukkan dalam gambar). 2. Kemudian klik [Gear] di penjuru kanan sebelah atas untuk membuka tetapan (seperti yang ditunjukkan dalam gambar). 3. Kemudian cari dan buka [Tetapan Umum] (seperti yang ditunjukkan dalam gambar). 4. Kemudian masukkan pilihan [Video Follow] (seperti yang ditunjukkan dalam gambar). 5. Kemudian buka tetapan [Video Upload Resolution] (seperti yang ditunjukkan dalam gambar). 6. Akhir sekali, pilih [Kualiti Imej Asal] untuk mengelakkan pemampatan (seperti yang ditunjukkan dalam gambar).
2 Cara untuk Alih Keluar Slow Motion daripada Video pada iPhone
Mar 04, 2024 am 10:46 AM
Pada peranti iOS, apl Kamera membolehkan anda merakam video gerak perlahan, atau 240 bingkai sesaat jika anda mempunyai iPhone terkini. Keupayaan ini membolehkan anda menangkap aksi berkelajuan tinggi dengan terperinci yang kaya. Tetapi kadangkala, anda mungkin mahu memainkan video gerak perlahan pada kelajuan biasa supaya anda boleh menghargai butiran dan tindakan dalam video dengan lebih baik. Dalam artikel ini, kami akan menerangkan semua kaedah untuk mengalih keluar gerakan perlahan daripada video sedia ada pada iPhone. Cara Mengalih Keluar Gerak Perlahan daripada Video pada iPhone [2 Kaedah] Anda boleh menggunakan Apl Foto atau Apl iMovie untuk mengalih keluar gerakan perlahan daripada video pada peranti anda. Kaedah 1: Buka pada iPhone menggunakan aplikasi Photos
Bagaimana untuk menerbitkan karya video Xiaohongshu? Apakah yang perlu saya perhatikan semasa menyiarkan video?
Mar 23, 2024 pm 08:50 PM
Dengan kemunculan platform video pendek, Xiaohongshu telah menjadi platform untuk ramai orang berkongsi kehidupan mereka, meluahkan perasaan mereka dan mendapatkan trafik. Pada platform ini, menerbitkan karya video ialah cara interaksi yang sangat popular. Jadi, bagaimana untuk menerbitkan karya video Xiaohongshu? 1. Bagaimana untuk menerbitkan karya video Xiaohongshu? Mula-mula, pastikan anda mempunyai kandungan video yang sedia untuk dikongsi. Anda boleh menggunakan telefon bimbit anda atau peralatan kamera lain untuk merakam, tetapi anda perlu memberi perhatian kepada kualiti imej dan kejelasan bunyi. 2. Edit video: Untuk menjadikan kerja lebih menarik, anda boleh mengedit video. Anda boleh menggunakan perisian penyuntingan video profesional, seperti Douyin, Kuaishou, dsb., untuk menambah penapis, muzik, sari kata dan elemen lain. 3. Pilih kulit muka: Kulit adalah kunci untuk menarik pengguna untuk mengklik.
Bagaimana untuk menukar video yang dimuat turun oleh pelayar uc kepada video tempatan
Feb 29, 2024 pm 10:19 PM
Bagaimana untuk menukar video yang dimuat turun oleh pelayar UC menjadi video tempatan? Ramai pengguna telefon mudah alih suka menggunakan Pelayar UC Mereka bukan sahaja boleh melayari web, tetapi juga menonton pelbagai video dan program TV dalam talian, dan memuat turun video kegemaran mereka ke telefon bimbit mereka. Sebenarnya, kami boleh menukar video yang dimuat turun kepada video tempatan, tetapi ramai orang tidak tahu bagaimana untuk melakukannya. Oleh itu, editor secara khas membawakan anda kaedah untuk menukar video yang dicache oleh pelayar UC kepada video tempatan saya harap ia dapat membantu anda. Kaedah untuk menukar video cache pelayar uc kepada video tempatan 1. Buka pelayar uc dan klik pilihan "Menu". 2. Klik "Muat Turun/Video". 3. Klik "Video Cache". 4. Tekan lama mana-mana video, apabila pilihan muncul, klik "Buka Direktori". 5. Semak yang anda ingin muat turun
