Question

由于某些原因（仅限移动设备），在我的网页Tag is treated as a dictionary上显示此视频后会出现较大差距 - 只有移动设备上才会出现大差距。

有什么想法吗？

谢谢！：）

斯科特

CSS：

                <!-- Video test -->

                    <div id="video_overlays">

                    <div class="abovethefold">
                        <h1 class="blog-title"><?php bloginfo( 'name' ); ?></h1>
                        <?php $description = get_bloginfo( 'description', 'display' ); ?>
                        <?php if($description) { ?><p class="blog-description"><?php echo $description ?></p><?php } ?>

                            <p class="button">
                    <a class="blue-button" href="#cta">Let's work together</a></p>
                    </div></div>


                <div class="homepage-hero-module">
                    <div class="video-container">
                        <div class="filter"></div>
                        <video autoplay loop class="fillWidth">
                            <source src="http://scott.ewarena.com/blog/wp-content/themes/bootstrapstarter/Busy-People/MP4/Busy-People.mp4" type="video/mp4" />Your browser does not support the video tag. I suggest you upgrade your browser.
                            <source src="http://scott.ewarena.com/blog/wp-content/themes/bootstrapstarter/Busy-People/WEBM/Busy-People.webm" type="video/webm" />Your browser does not support the video tag. I suggest you upgrade your browser.
                            <img src="http://scott.ewarena.com/blog/wp-content/themes/bootstrapstarter/Busy-People/Snapshot/Busy-People.jpg" title="Your browser does not support the <video> tag">
                            </video>
                                                    <div class="poster hidden">
                            <img src="http://scott.ewarena.com//blog/wp-content/themes/bootstrapstarter/Busy-People/Snapshots/Busy-People.jpg" alt="">
                            </div>
                    </div>
                </div>

HTML：

Wrapper

Answer 1

尝试制作.homepage-hero-module身高35vh

.homepage-hero-module {
  height: 35vh; /* 35% of viewport height */
}

移动设备上的HTML5视频下方存在较大差距

1 个答案: