微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Django Video Wont Play如何解决?

如何解决Django Video Wont Play如何解决?

enter image description here

我正在尝试加载以gyazo录制的基本视频,但无法加载我的视频,该视频为mp4,并且名称正确,并且我在顶部加载了{%static%},并确保该视频为在我的静态图片文件和设置中:

STATICFILES_Dirs = [
   os.path.join(BASE_DIR,"static"),]

也正确,我不确定如何解决此问题 这就是我从gyazo加载视频的方式

<video width="430" height="340" controls autoplay>
  <source src="{% static dam.mp4 %}" type="video/mp4"> </source> damcool
</video>

这是我的完整代码

* {
  Box-sizing: border-Box;
}

body {
  font-family: Arial,Helvetica,sans-serif;
}

* {
  Box-sizing: border-Box;
}

body {
  font-family: "Times New Roman",Georgia,Serif;
}

h1,h2,h3,h4,h5,h6 {
  font-family: "Playfair display";
  letter-spacing: 0px;
  color: white;
}


/* Style the header */

.header {
  background-color: #58D68D;
  padding: 10px;
  text-align: center;
  font-size: 35px;
}


/* Create three equal columns that floats next to each other */

.column {
  float: left;
  width: 73.33%;
  padding: 10px;
  height: 300px;
  /* Should be removed. Only for demonstration */
}


/* Clear floats after the columns */

.row:after {
  content: "";
  display: table;
  clear: both;
}


/* Style the footer */

.footer {
  background-color: #58D68D;
  padding: 10px;
  text-align: center;
}

.button3 {
  border-radius: 1px;
}

.w {
  color: white;
}

body {
  background-color: #424949;
}


}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 600px) {
  .column {
    width: 100%;
  }
}
.button {
  background-color: #4CAF50;
  /* Green */
  
  border: none;
  color: white;
  padding: 115px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 36px;
  margin: 4px 2px;
  cursor: pointer;
  transition: width 2s;
}
.button2 {
  background-color: #008CBA;
}

/* Blue */
.button3 {
  background-color: #f44336;
}

/* Red */
.button4 {
  background-color: #e7e7e7;
  color: black;
}

/* Gray */
.button5 {
  background-color: #555555;
}

/* Black */
.button:hover {
  width: 500px;
}
.button:hover {
  width: 500px;
}

/* Style the top navigation bar */
.topnav {
  width: 250px;
  height: 510px;
  margin: auto;
  width: 30%;
  padding-top: 20px;
  background-color: #333;
}

/* Style the topnav links */
.topnav a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 6px 8px 6px 16px;
  text-decoration: none;
}
.topnav {
  Box-shadow: 0 8px 16px 0 rgba(0,0.2),0 6px 20px 0 rgba(0,0.19);
}

/* Change color on hover */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}
.w {
  color: white;
}
.codeBox {
  border: 1px solid black;
  background-color: #EEEEFF;
  white-space: pre-line;
  padding: 10px;
  font-size: 0.9em;
  margin-left: -200px;
  margin-bottom: 10px;
  width: 560px;
  line-height: 20px;
  display: inline-block;
}
.codeBox1 {
  border: 1px solid black;
  background-color: #EEEEFF;
  white-space: pre-line;
  padding: 10px;
  font-size: 0.9em;
  margin-left: -450px;
  margin-top: -150px;
  width: 660px;
  line-height: 20px;
  display: inline-block;
}
.wa {
  color: white;
}

/* Create three equal columns that floats next to each other */
.column {
  float: right;
  width: 33.33%;
  padding: 15px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width:600px) {
  .topnav,.codeBox1 {
    height: 590px;
    width: 70%;
  }
}
<!DOCTYPE html> {% load static %}

<html lang="en">

<head>
  <Meta charset="utf-8">
  <Meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Learn To Code</title>
  <Meta name="viewport" content="width=device-width,initial-scale=1">
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>

<body>
  <div style="background-color:#58D68D;" class="header3">
    <h1>Make Your First Game With Python</h1>
  </div>

  <div class="column">
    <div class="w">
      <h1> What Will I Learn? </h1>
    </div>
    <h5> On this Tutorial you will learn how to make a simple platform game after you finish all the tutoiral you will learn the concept of making a simple game and you will make many games without a sweet! if your stuck on anything or your getting an error
      that you cant solve message me on insta: @bruh_habib1 I will help!!

    </h5>
  </div>

  <video width="430" height="340" controls autoplay>
  <source src="{% static dam.mp4 %}" type="video/mp4">damcool
</video>


  <div class="topnav">
    <div class="w">
      <h1> Tutorials! </h1>
    </div>
    <a style="background-color:#1abc9c;" href="/platforms">Pygame#0.5 What You Will Learn</a>
    <a href="/home">~Start by...</a>
    <a href="/home">~Draw A Window And Player #1</a>

    <a href="">~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~</a>

    <a href="/move-player">~Move The Player With Arrow Keys</a>

    <a href="">~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~</a>

    <a href="/jump-player">~Make The Player Jump With Space</a>


    <a href="">~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~</a>

    <a href="/platforms">~Adding Platforms % Collisions</a>

    <a href="">~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~</a>

    <a href="/coins">~Add Coins&Coin Collisions</a>

    <a href="">~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~</a>

    <a href="/scores">~Adding The score!</a>
  </div>

  <div class="column">
    <div class="w">
      <h1>Stuck On A Problem?</h1>
    </div>
    <h5> if your having an issue or a problem just message me and I will help you out! my insta: @bruh_habib1
    </h5>
  </div>



</body>

</html>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。