html - 该网站不会在 Kindle Fire HDX 等少数布局上向下滚动-6ren

html - 该网站不会在 Kindle Fire HDX 等少数布局上向下滚动

转载作者：行者123 更新时间：2023-11-28 00:04:59

我想让我的网站响应所有设备。它在台式机和 Android 手机上也能正常工作。但是，对于其他设备，如(Kindle Fire HDX、Nexus 7、iPad mini、iPhone 6、7、8、Ipad pro，网站不会向下滚动。我正在使用检查元素选项测试我的网站。

我正在使用以下查询来启用滚动，但它不起作用并且屏幕在上述设备上卡住了。

   <!DOCTYPE html>
<html >


@media screen and (max-width: 1440px  ) {
body {
  overflow-x: hidden;
  overflow-y: auto; 
}   
   html {
    overflow-x: hidden; }
	nav{
	display: none;}
}
@media screen and (max-width: 960px ) {
body {
  overflow-x: hidden;
  overflow-y: auto; 
}
	html{
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch;
	}
	
	header .headercontent {
		width: 100%;
	}
	.page-wrap {
		background: #fff ;
	}
	nav ul {
		width: 100%;
	}
	section#hero {
		width: 100%;
		height: auto;
		min-height: 40px;
	}
	div#hero {
		width: 100%;
		height: auto;
	}
	div #hero .cycle-slideshow {
		min-height: 440px;
	}
	div.page div.content {
		width: 85%;
		padding-left: 5%;
		padding-right: 5%;
	}

	div.page div.sidebar {
		width: 90%;
		margin: 0 5%;
		padding: 0;
	}
	.bannerimage {
		width: 90%;
		padding: 5%;
		position: static !important;
		margin-left: auto;
		margin-right: auto;
		/*box-sizing: border-box;*/
		float: left;
	}
/*	div#hero img {
		max-width: 60%;
	}*/
	div.page {
		width: 100%;
	}
	
	div.copyrightinner {
		width: 100%;
	}
	footer div.info {
		width: 100%;
	}
}

@media screen and (max-width: 1920px) {
	body {
  overflow-x: hidden;
  overflow-y: auto; 
}
	html {
    overflow-x: hidden; }
    
	nav{
	display: none;
}

}
@media screen and (max-width: 805px) {
	/* Do something about the footer */
/*	html, body {
		overflow-x: hidden;
	}*/

	.navbar{
		display: none;
	}
	.bannerimage {
		width: 90%;
		padding: 5%;
		position: static !important;
		margin-left: auto;
		margin-right: auto;
		/*box-sizing: border-box;*/
		float: left;
	}
	div.page, div.sidebar div.services {
		overflow:hidden;
	}
	div.contentcontact h1{
		display: none;
	}
	div.contentcontact{
		height: 50px;
		padding-top: 30px;
	}
	div.contentcontact p#blue{
		display: none;
	}
	div.contentcontact img{
		display: none;
	}
	.page-wrap {
		background: #fff;
	}
	#slider-prev, #slider-next {
		display: none;
	}
	div.page div.sidebar div.latestnews{
		display:none;
	}
	
	.slider-image {
		background-color: #fff;
		margin-left: 0;
/*		padding-left: 20px;*/
	}
/*	.slider-image h2 {
		margin-top: 10px;
	}*/
	footer {
		height: auto;
		position: relative;

	}
	div.copyright {
		background-color: #0053a0;
	}
	div.column2, div.column3
	{display:none;
	}

	div.column1, div.column2, div.column3 {
		float: none;
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}
	.page-wrap {
		/*min-height: 80%;*/
		margin-top: 0;
	}
    header
    {

border-top: 3px solid #0053a0;
	
    }
	header div.logo {
		float: none;
		margin-left: auto;
		margin-right: auto;
		padding-right: 0;
		width: 216px;
	}
	

	header h2.cta {
		display: block;
		float:none;
		display:none;
	}
	nav {
		display: none;
		background: #02407c;
		height: auto;
		margin-bottom: 0;
		border-bottom: 0;
	}
	nav ul {
		border: 0;
		margin-left: auto;
		margin-right: auto;
	}
	nav ul li {
		width: 100%;
		border: 0;
	    border-bottom: 2px solid #0069BD;
	}
	nav li ul li a {
		background-image: none !important;
		padding-left: 50px;
	}
	nav ul li ul li a {
		border-top: none;
		border-bottom: none;
	}
	nav ul li ul li.last a {
		border-bottom: none;
	}
	img {
		max-width: 100%;
	}
	nav a {
		width: 100%;
		display: block;
	}
	
	div.mobilenavbtn {
		display: block;
		width: 100%;
		background: #02407c;
		position: relative;
		padding-top: 3px;
	}
	div.mobilenavbtn .content {
		width: 30px;
		margin-left: auto;
		margin-right: auto;
	}
	div.mobilenavbtn img {
		margin-left: auto;
		margin-right: auto;
		height: 30px;
	}
	footer hr {
		margin-bottom: 0;
	}
	div.copyright {
		height: 80px;
		padding-top: 20px;
		border-bottom: 1px solid #fff;

	}
	div.copyright div.left {
		float: none;
		width: 100%;
		text-align: center;
	}
	div.copyright div.right {
		float: none;
		width: 100%;
		margin-top: 20px;
		text-align: center;
	}
	div.search {
		box-sizing: border-box;
		margin-top: 0;
		padding-top: 10px;
		padding-bottom: 10px;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		background: #03386b;

	}
	div.smalllinks {
		margin-top: 10px;
	}
	div.search form {
		width: 180px;
		margin-left: auto;
		margin-right: auto;
		position: relative;
	}
	div.breadcrumb ul { 
		margin-left: 20px;
	}
	nav li ul {
		width: 100%;
		visibility: visible;
		position: static;
		display: none;
	}
	nav {
		position: relative;
		z-index: 100;
	}
	nav .menucontainer {
		width: 100%;
	}

	nav li ul li {
		width: 100%;
	}
	nav ul li ul li a {
		width: 100%;
	}


	div.breadcrumb {
		width: 100%;
	}


.services {
	display: none;
}
.latestnews .image {
	width: 100px;
	margin-top: 20px;
	float: left;
}
.latestnews .info {
	display: none;
}
.latestnews .info:first-of-type {
	width: 100%;
	margin-top: 20px;
	float: left;
	padding-left: 10px;
	font-size: 16px;
	color: #03396d;
	font-weight: 600;
	display: block;
}
.readmore {
	display: block;
	height: 24px;
	margin-top: 26px;
}
.latestpubs .viewall {
	display: block;
	height: 24px;
	margin-top: 10px;
	color: #03396d;
	font-weight: 600;
}
.latestpubs .viewall a {
	color:#03396d !important;
	font-size: 15px;
}
.readmore img {
	display: inline-block;
	position: relative;
	top: 4px;
	left: 10px;
}
.readmore a {
	color: #03396d;
}
.latestpubs .viewall img {
	display: inline-block;
	position: relative;
	top: 4px;
	left: 10px;
}

.latestnews h2 {
	display: block;
	width: 100%;
	font-size: 20px;
	padding-left: 30px;
	padding-bottom: 5px;
	border-bottom: 1px solid #0053a0;
	background-image: url('/bundles/pcaapp/images/news.jpg');
	background-repeat: no-repeat;
	background-position: top left;
	box-sizing: border-box;
}
.latestpubs h2 {
	display: block;
	font-size: 20px;
	width: 100%;
	padding-left: 30px;
	padding-bottom: 5px;
	border-bottom: 1px solid #0053a0;
	background-image: url('/bundles/pcaapp/images/publications.jpg');
	background-repeat: no-repeat;
	background-position: top 2px left;
}
.services h2 {
	display: block;
	font-size: 20px;
	width: 100%;
	padding-left: 30px;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 1px solid #0053a0;
	background-image: url('/bundles/pcaapp/images/services.png');
	background-repeat: no-repeat;
	background-position: top -1px left;
}
.services ul {
	margin-left: 0;
	margin-bottom: 20px;
}
.services ul li a {
	color: #03396d;
	font-size: 16px;
	font-weight: 600;
}
.services ul li {
	display: block;
	background-image: url('/bundles/pcaapp/images/li.png');
	background-repeat: no-repeat;
	background-position: top 13px left;
	padding-bottom: 8px;
	padding-left: 25px;
	border-bottom: 1px dotted #0053a0;
	padding-top: 7px;
}
.services ul li.active a, .services ul li:hover a {
	color: #e35b00;
}
.services ul li.active, .services ul li:hover{
	background-position: top 13px left 5px;
}

.latestpubs ul {
	list-style-image: url('/bundles/pcaapp/images/dlbullet.png');
	margin-top: 10px;
	margin-left: 20px;
}
.latestpubs ul li {
	color: #0271d8;
	font-size: 13px;
	padding-top: 8px;
}

div.smalllinks {
	width: auto;
}

}

/* iPad in portrait and below */
@media screen and (max-width: 768px) {
	body {
  overflow-x: hidden;
  overflow-y: auto; 
}
	.latestnews .info {
		width: 49%;
		padding-left: 1%;
	}

	div.smalllinks {
		text-align: center;
	}

		div.smalllinks ul {
			margin-left: 0;
		}

	div.page div.content div.contact div {
		width: 90% !important;
		margin: 0 5% 20px 5%;
		float: left;
	}
div.contact form label {
		margin-bottom: 5px;
		width: 100%;
		margin-left: 0;
	}

	div.contact form label {
		margin-bottom: 5px;
		width: 100%;
		margin-left: 0;
	}

	div.contact {
		height: auto;
		padding-bottom: 20px;
	}

	div.page div.content #google_map {
		width: 100% !important;
	}

	div.page div.content div.contact {
		width: 100%;
	}

	div.contact input[type=text], 
	div.contact input[type=email],
	div.contact textarea {
		width: 90%;
		padding: 3%;
		left: 0;
	}
}

@media screen and (max-width: 540px) {
	body {
  overflow-x: hidden;
  overflow-y: auto; 
}
	.subFooter .break {
		clear: both;
		margin-bottom: 20px;
	}
}

/* iPhone 6 Plus and below */
@media screen and (max-width: 414px) {
	
	body {
  overflow-x: hidden;
  overflow-y: auto; 
}
	.latestnews .info {
		width: 100%;
		padding-left: 0;
	}

	footer h3 {
		width: 100%;
	}

	ul.news-articles li article div h3 {
		margin-bottom: 5px;
	}

	div.contact form label {
		margin-left: 0;
		width: 100%;
	}
}

@media screen and (-webkit-min-device-pixel-ratio: 2) {
	body {
  overflow-x: hidden;
  overflow-y: auto; 
}
	header div.logo a {
		background-image: -webkit-image-set( url('/bundles/pcaapp/images/site_logo.jpg')    1x,
			url('/bundles/pcaapp/images/site_logo_2x.png') 2x);
	}
}


nav a { 
	text-decoration: none;
	color: inherit;
}
nav {
	/* border-top: 1px solid #04294d; */
	/* border-bottom: 2px solid #04294d; */
	height: 37px;
	/* background: url('/bundles/pcaapp/images/nav_bg.jpg') repeat-x; */
}

nav ul li { display: inline; 
}
nav .menucontainer {
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
nav ul { 
	list-style-type: none;
	float: left;
}
ul { 
	display: block;
	margin: 0;
	padding: 0;
}
nav ul li {
	position: relative;
	float: left;
}
nav ul li a {ow
	box-sizing:border-box;
	padding-left: 17px;
	padding-right: 17px;
	color: #fff;
	text-transform: uppercase;
	height: 39px;
	display: inline-block;
	padding-top: 10px;
	font-size: 14px;
	float: left;
}

nav ul li.first {
}
nav ul li.current, nav ul li.current a, nav ul li:hover, nav ul li:hover > a {
	    border-bottom: 1px solid #0069BD;
}
nav ul li.last a {

}

<!DOCTYPE html>
<html >
	<! head >
<head profile="http://www.w3.org/2005/10/profile"> <! image displayed on the tab alongwith the title>
    <link rel="icon" 
           type="image/png" 
           href="images/logo.jpg" /> <! image displayed on the tab alongwith the title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <! encoding scheme>
		<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0">
    <title>Marvel Tech</title>  <!title of the tab>
		<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"> <!icons used in footer>
		<link rel="stylesheet" href="style.css" /> <!stylesheet Linking>
		<script src="jquery.min.js"></script> <! javascript used for slider animation>
		<script type='text/javascript' src='slider.js'></script> <! javascript used for slider animation>
</head> 
    <! Body>        
<body>
        <div class="page-wrap">
		 <!- Header section >
<header>
		<div class="headercontent">
		  <div class="logo">
		<img src="images/newlogo.jpg" >
          </div>
		  
<div class="navbar">
         <a class="current" href="Marvel_Tech.html">Home</a>
	     <div class="dropdown">
		 <button class="dropbtn">Services 
		     <i class="fa fa-caret-down"></i> <!arrow displayed next to drop-down list>
		</button>
		<div class="dropdown-content">
		  <a href="Services.html">Design</a>
		  <a href="Services.html">Consulting</a>
		  <a href="Services.html">R&D</a>
		</div>
	  </div> 
	   <div class="dropdown">
		 <button class="dropbtn">Software
		     <i class="fa fa-caret-down"></i> <!arrow displayed next to drop-down list>
		</button>
		<div class="dropdown-content">
		  <a href="Software.html">Steam Turbine Design Package</a>
		  <a href="Software.html">Gas Turbine Design Tools</a>
		  <a href="Software.html">Power Plant Monitoring</a>
		  <a href="Software.html">Prognostic System</a>
		</div>
	  </div> 
	  <div class="dropdown">
		 <button class="dropbtn">Products
		     <i class="fa fa-caret-down"></i> <!arrow displayed next to drop-down list>
		</button>
		<div class="dropdown-content">
		  <a href="Products.html">ORC Turbine</a>
		  <a href="Products.html">Gas Turbine</a>
		  <a href="Products.html">Saturated Team Turbine</a>
		</div>
	  </div> 
		<a href="About.html">About</a>
		<a href="Contact.html">Contact </a>
		<div class="dropdown">
		<button class="dropbtn">Language
		  <i class="fa fa-caret-down"></i>  <!arrow displayed next to drop-down list>
		</button>
		<div class="dropdown-content">
	      <a href="Marvel_Tech.html"><img src="images/english.png"> English    </a>
	      <a href="Marvel_Tech_Chinese.html"><img src="images/chinese.png"> Chinese  </a> <!- Mention the name of chinese page in place of hash.>
		</div>
	  </div> 
</div>
		</div>	
	</div>
		</div>	
	</div>
</header>
<!–– Navigation Bar to be dispalyed in mobiles and tablets>
<nav>
		<div class="menucontainer">
	    <ul>    
          <li class="current first">        <a href="Marvel_Tech.html">Home</a></li>
          <li>   <a href="Services.html">Services</a></li>               
          <li>   <a href="Software.html">Software</a></li>
          <li>   <a href="Products.html">Products</a></li>
          <li>   <a href="About.html">About</a></li>
          <li >  <a href="Contact.html">Contact </a></li>
          <li class="last">        <a href="Contact.html">Language </a></li>
		</ul>	
		</div>
</nav>
<!- Navigation bar icon displayed on mobiles and tablets>
<div class="mobilenavbtn">
	<div class="content">
	<a href="#"><img src="images/mobilenavbtn.png" alt="Menu"></a>
	</div>
</div>
        	  <!- Slider Section >
<section id="hero">
	<div id="hero" style="position:relative;">
		<div id="slider-prev">
			<img src="images/slide_left.png" alt="Previous Slide"> <!image of arrow head on the left side of the slider to slide on previous image>
		</div>
		<div class="cycle-slideshow" data-cycle-fx="scrollHorz" data-cycle-timeout="5000" data-cycle-slides="> div" data-cycle-prev="#slider-prev" data-cycle-next="#slider-next" style="position: relative
		; overflow: hidden;">	<! slider animation>
				<div class="slider-image cycle-slide" style="clear: both; width: 100%; box-sizing: border-box; position: absolute; top: 0px; left: 0px; z-index: 95; opacity: 1; display: block; visibility: hidden;">
				 <div style="width: auto;position: static; top: 0; left: 0; z-index: 70;"> 
						<img src="images/Turbomachinery.jpg"> <! slider image>
					</div>
					<div style="position: absolute; z-index: 80; background-color: rgba(255,255,255,0.9); top: 200px; left: 655px;" class="bannerimage">
						<h2>Steam Turbine <em>Technology</em></h2>
						<p align="justify">We are experts in the design, retrofit and analysis of steam turbines of all scales. With complete and powerful in-house  design tools and procedures, we can design steam
						turbines from 1MW up to 1000MW.

						</p> <! text on slider image>
							<div class="readmore">
								<a href="/services/turbomachinery-design">Read More</a>
							</div>
											</div>				
			  </div>
			  <! Second image of the slider>
		<div class="slider-image cycle-slide cycle-slide-active" style="clear: both; width: 100%; box-sizing: border-box; position: absolute; top: 0px; left: 0px; z-index: 99; visibility: visible; opacity: 1; display: block;">
					<div style="width: auto;position: static; top: 0; left: 0; z-index: 70;">
						<img src="images/engine.png">
					</div>
					<div style="position: absolute; z-index: 80; background-color: rgba(255,255,255,0.9); top: 170px; left: 655px;" class="bannerimage">
						<h2>Special Turbomachinery <em>Products</em></h2>
						<p align="justify">We design, test and build not only traditional turbomachinery, but also products with completely new concepts like TRT
						(Top-gas Recovery Turbine), ORC (Organic Rankine Cycle) turbines, SCO2 (super-critical CO2) compressors and turbines. 
						 
</p>
						<div class="readmore">
								<a href="/services/turbomachinery-design">Read More</a>
							</div>
											</div>					
			</div>
			     <!- Third image of the slider>			  
			<div class="slider-image cycle-slide cycle-slide-active" style="clear: both; width: 100%; box-sizing: border-box; position: absolute; top: 0px; left: 0px; z-index: 99; visibility: visible; opacity: 1; display: block;">
					<div style="width: auto;position: static; top: 0; left: 0; z-index: 70;">
						<img src="images/power.jpg">
					</div>
					<div style="position: absolute; z-index: 80; background-color: rgba(255,255,255,0.9); top: 185px; left: 655px;" class="bannerimage">
						<h2>Power Plant <em>Technology</em></h2>
						<p align="justify">We develop our unique digital solution for the monitoring and prognostic system of the whole Combined Cycle Power Plants. This system is able to record and predict the performances of key equipment
						in CCCP like gas and steam turbine, HRSG. 
</p>
						<div class="readmore">
								<a href="/services/turbomachinery-design">Read More</a>
							</div>
											</div>					
			</div>
			     <! Fourth image of the slider>	
			<div class="slider-image cycle-slide" style="clear: both; width: 100%; box-sizing: border-box; position: absolute; top: 0px; left: 0px; z-index: 97; visibility: hidden; opacity: 1; display: block;">
					<div style="width: auto;position: static; top: 0; left: 0; z-index: 70;">
						<img src="images/aircraft.jpg">
					</div>
					<div style="position: absolute; z-index: 80; background-color: rgba(255,255,255,0.9); top: 210px; left: 655px;" class="bannerimage">
						<h2>Aircraft <em>Propulsion</em></h2>
						<p align="justify"> We provide design and consulting services for key components of the aircraft engines.
						For aerodynamic problems of the aircraft like the fuselage, engine housing etc. we can also deliver experienced design and analysis services.  
.</p>
						<div class="readmore">
								<a href="/services/turbomachinery-design">Read More</a>
							</div>
											</div>						
			</div>
			        <! Fifth image of the slider>	
			<div class="slider-image cycle-slide" style="clear: both; width: 100%; box-sizing: border-box; position: absolute; top: 0px; left: 0px; z-index: 96; visibility: hidden; opacity: 1; display: block;">
					<div style="width: auto;position: static; top: 0; left: 0; z-index: 70;">
						<img src="images/industrail compressor.jpg">
					</div>
					<div style="position: absolute; z-index: 80; background-color: rgba(255,255,255,0.9); top: 210px; left: 655px;" class="bannerimage">
						<h2>Gas Turbine <em>Technology</em></h2>
						<p align="justify">We have long years of experiences in gas turbine development. We have independent design capabilities of gas turbine compressors, combustors and turbine blades, all from
						scratch to tests and delivering top performance design. 
</p>
						<div class="readmore">
								<a href="/services/turbomachinery-design">Read More</a>
							</div>
											</div>
			</div>
			
					        <! Sixth image of the slider>	
			<div class="slider-image cycle-slide" style="clear: both; width: 100%; box-sizing: border-box; position: absolute; top: 0px; left: 0px; z-index: 96; visibility: hidden; opacity: 1; display: block;">
					<div style="width: auto;position: static; top: 0; left: 0; z-index: 70;">
						<img src="images/rods.png">
					</div>
					<div style="position: absolute; z-index: 80; background-color: rgba(255,255,255,0.9); top: 230px; left: 655px;" class="bannerimage">
					<h2 >Combustion <em>Technology</em></h2>
						<p align="justify">We understand the combustion processes very well and are few of the teams in world that can exactly calculate complex combustion processes from household boilers to large gas
						turbines. 

</p>
						<div class="readmore">
								<a href="/services/turbomachinery-design">Read More</a>
							</div>
											</div>
			</div>	
			
			
			</div>
		<div id="slider-next">  <!image of arrow head on the right side of the slider to slide on previous image>
			<img src="images/slide_right.png" alt="Next Slide">
		</div>
	</div>
</section>
               <!- Overview section >
<div class="pagecontainer">
		<div class="page">	
			<div class="content" style="clear: both;">
				<h1 class="homepage">Marvel-Tech Limited provides following services and product for both domestic and international clients: 
 </h1>
						<ul>
						<li ><div class="readmore"><a href="#">Gas Turbine Technology:</i></a>  Design, Retrofit and Analysis, R&D, Design Tools, test support</li>
						<li><div class="readmore"><a href="#">Steam Turbine Technology: </i></a> Design and Analysis, R&D, Design Tools</li>
						<li><div class="readmore"><a href="#">Power Plant Technology:  </i></a> CCCP Monitoring and Prognostic System </li>
						<li><div class="readmore"><a href="#">Combustion Technology:  </i></a> Design, Analysis, R&D, test support, design tools </li>
						<li><div class="readmore"><a href="#">Aircraft Propulsion:   </i></a> Design, Analysis, R&D, Design Tools</li>
						<li><div class="readmore"><a href="#">Special turbomachinery:  </i></a> Concept and Detailed Design, test, R&D</li></ul>
			
					
      </div>
			     <!- News Section >
<div class="sidebar">          
			<div class="latestnews">
			  <h2>Latest <em>News</em></h2>
			  <! First News>
	      <div class="info">Marvel Tech was crowned champions in intelligent manufacturing.<! News Headline>
				  <p>The Pujian branch of Caohejing Hi-tech Park held the final of the intelligent manufacturing section of Shanghai Youth Innovation and Entrepreneurship
					 Competition. </p>
					  <div class="readmore"><a href="#">Read More   <i class="fa fa-external-link" aria-hidden="true"></i></a> <! read more link and symbol in front of read more>
					  </div>
			 </div>
         <! Second News>
       <div class="info">IMechE Webinar on centrifugal compressor design
				  <p>Hear the seminar given by Hamid Hazby and Mick Casey online via the IMechE&#039;s website.</p>
						<div class="readmore"><a href="#">Read More   <i class="fa fa-external-link" aria-hidden="true"></i></a> 
						</div>
			 </div>
			</div>
</div>
	</div>
</div>
                 <!- Footer Section >
<footer>
<div class="info">
	<! First Column in the footer>
<div class="column1"> 
	<h3>Marvel<span><em>Tech</em></span></h3>
		<p>
			<a href="Marvel_Tech.html">Home</a>
					.
			<a href="Services.html">Services</a>
					.
			<a href="Software.html">Software</a>
					.
			<a href="Products.html">Products</a>
					.
			<a href="About.html">About</a>
					.
			<a href="Contact.html">Contact</a>
				</p>
            <p>MARVEL-TECH LIMITED © 2016</p>
		</div>
			<! Second Column in the footer>
	<div class="column2">
		<h3>Contact Us</h3>
		<div class="footer-center">
		<div>
		<span><i class="fa fa-map-marker"></i> <! adding the location symbol>
		    <p>Dongchuan Road No. 555<br> Minhang, Shanghai</p>
		</span>
		</div>
		<div>
			<i class="fa fa-phone"></i>   <! adding the phone symbol>
			<p>+86 60676923</p>
		</div>
		<div>
			<i class="fa fa-envelope"></i> <! adding the email symbol>
			<p>	<a href="mailto:info@marvel-tech.cn">info@marvel-tech.cn</a>
			</p>
		</div>
		</div>
	</div>
		   		<! Third Column in the footer>
	<div class="column3">
		<h3>About the Company</h3>
			<div class="footer-right">
				<p  align="justify" class="footer-company-about">
					Since 2015, we have been providing a range of innovative services on design, calculations and expertise for energy conversion machinery.
				</p>
			</div>
	</div>
</div>
</footer>
</body>
</html>

我该如何解决这个问题，让网站也适应这些设备。

最佳答案

你试过吗:

body {
  overflow-x: hidden;
  overflow-y: auto; 
}

关于html - 该网站不会在 Kindle Fire HDX 等少数布局上向下滚动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55762136/

文章推荐： css - 如何使用 css 在输入框前放置标签？

文章推荐： javascript - 用js单独展开flex对象

文章推荐： javascript - 在 QR 码符号中存储 vCard 数据的最有效方法

文章推荐： Javascript - 没有实现契约(接口(interface))的依赖注入(inject)

.net - 体面的低占用空间Web服务器？ (。网)
我正在寻找的服务器是: 轻量级，非 buggy ，支持.NET，在客户端上运行以进行测试，在Windows上运行 Cassinni太过马车，IIS太昂贵，Apache很难安装，XSP仅是lin
.net - 从调试版本中检测发行版本的最佳方法？。网
所以我有大约10个短的css文件，可以与mvc应用程序一起使用。有像 error.css login.css 等等... 仅有一些非常短的CSS文件，这些文件使更新和编辑变得容易(至少对我而言)。我
.net - UI自动化中如何调用快捷键？/。网
我正在编写程序来自动化 win32 表单。我正在使用 Microsoft UI 自动化库。我不知道如何获取和调用该表单上的预定义快捷键。现在我只需获取 MenuItem 的 AutomationEle
.net - 如何在代码中将鼠标光标设置为混合沙漏和箭头？ (。网)
我有一个在后台线程上运行的及时操作。运行时，我当前将光标置于等待状态: Mouse.OverrideCursor = Cursors.Wait 我刚刚实现了一项功能，允许用户在厌倦等待时单击“取消”按
.net - 如何找到所有可能直接或间接调用给定方法的单元测试？ (。网)
如何找到所有可能直接或间接调用给定方法的单元测试？当我更改方法时，我希望知道要运行的最佳测试；必须有一个工具! 因为我们有很多接口(interface)，所以我对所有调用接口(interface)方法
.net - 类是盒装的吗？。网
我想知道，一个类会被装箱吗？我一直假设每个类都有一个虚拟表，可以用来标识类，所以它需要装箱吗？最佳答案只有值类型(结构)被装箱。类实例不会被装箱。关于.net - 类是盒装的吗？。网，我们在S
c# - 如何在浏览器控件中模拟点击事件？。网
所以接下来有一个按钮调用(页面)。它的 href 链接是 site/blah/#。所以我知道它真正运行的 javascript 代码。在我解析完第一页后，我想解析下一页。我如何模拟鼠标点击，以便我可以
c# - 泛型基类覆盖非泛型基类函数模式？ (。网)
我想知道是否有人对解决以下设计问题有好的建议/模式。我有一个命令类的层次结构。在最抽象的层面上，我有一个 ICommand 接口(interface)。执行 ICommand 的 RunCommand
c# - 如何从资源中获取文件作为流？ (。网)
我在资源(xsd 文件)中有几个文件可用于验证收到的 xml 消息。我使用的资源文件名为 AppResources.resx，它包含一个名为 clientModels.xsd 的文件。当我尝试使用这样
c# - 以图形方式显示正在执行的代码？。网
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。要求提供代码的问题必须表现出对所解决问题的最低限度理解。包括尝试过的解决方案、为什么它们不起作用，以及预
c# - 在 .网
(最后的简短版本) 我目前正在开发的软件需要跟踪任意数量的 MS Office 文件，现在需要提供将所有这些文件一起打印的功能，以及一些应用程序数据(可能会发送到打印机作为 .xps、.html 或
c# - 在没有命名空间或程序集的情况下查找要按名称实例化的类？ (。网)
我想在不指定命名空间或程序集的情况下按名称(字符串)实例化一个类。像这样(Unity 语法): var processor = container.Resolve("SpecialProcessor"
c# - 计算整数十进制长度的最快方法？ (。网)
我有一些代码可以对 64 位整数进行大量比较，但是它必须考虑数字的长度，就好像它被格式化为字符串一样。我无法更改调用代码，只能更改函数。最简单的方法(除了 .ToString().Length 之外
c# - 这个简单的条件运算符会在编译时优化吗？ (。网)
使用遗留代码，我发现我有很多这样的语句(超过 500 个) bool isAEqualsB = (a == b) ? true : false; 这样重写有意义吗？ bool isAEqualsB =
c# - 为什么要为初始化器烦恼？ (。网)
我有这个: AudioPlayer player = new AudioPlayer(); player.Directory = vc.Directory; player.StartTime = vc
c# - 为什么这种双重检查锁定是正确的？ (。网)
我已经阅读了很多关于双重检查锁定的危险的文章，我会努力远离它，但话虽如此，我认为他们的阅读非常有趣。我正在阅读 Joe Duffy 的这篇关于使用双重检查锁定实现单例的文章: http://www.
c# - 什么时候对不可变类型使用值和引用类型？ (。网)
对于可变类型，值类型和引用类型之间的行为差异很明显: // Mutable value type PointMutStruct pms1 = new PointMutStruct(1, 2); P
c# - 移位比Java中的乘法和除法更快吗？。网？
关闭。这个问题需要更多 focused .它目前不接受答案。想要改进这个问题吗？更新问题，使其只关注一个问题 editing this post . 关闭 6 年前。 Improve this q
cordova - Cordova 网::ERR_CACHE_MISS
我有一个 Cordova pp 我在 Controller 中调用post方法它可以在浏览器中工作，但是在构建和调试apk时出现错误 ionic.bundle.js:23826 POST http:
asp.net - 读取文件属性有多贵？。网
我们正在尝试将时间戳附加到某些 URL 以让内容缓存但在它们发生更改时更新它们。我们有代码可以归结为: DateTime ts = File.GetLastWriteTime(absPath); 其中

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

html - 该网站不会在 Kindle Fire HDX 等少数布局上向下滚动