无需更改主题的移动版Wordpress网站如何修改CSS

时间:2018-08-24 14:36:41

标签: css wordpress mobile version

您好,我正尝试给wordpress网站CSS,以便将其用于其他设备 我的作品适用于PC和平板电脑,但不适用于手机 手机拒绝加载CSS,我已将其加载 我使用的CSS:

/*headercover*/
body.has-header-image .custom-header-media img, .has-header-video .custom-header-media video, .has-header-video .custom-header-media iframe, .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-media img {
	
	width: 100%;
	height: auto;
	
	
	min-height: initial;
}
.home #content.custom-header-media {
	height: 45vw ;
		
}
@media screen and (max-width: 767px) and (min-width: 467px) {
.home.custom-header-media {
		
			height: 50px !important;
	}

	.home.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
		height: 10vw;
		margin-top: -138px;
	}

	.home.logged-in .wp-custom-header img {
		margin-top: 138px;
	}
}
@media screen and (max-width:467px) {
.home.custom-header-media {
		
			height: 50px !important;
	}

	.home.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
		height: 10vw;
		margin-top: -188px !important;
	}

	.home.logged-in .wp-custom-header img {
		margin-top: 188px !important;
	}
}
@media screen and (max-width: 35px) and (min-width: 0px) and (max-height: 350px) {
.home.custom-header-media {
	
			height: 50px !important;
	}

	.home.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
		height: -150vw;
		margin-top: -188px !important;
	}

	.home.logged-in .wp-custom-header img {
		margin-top: 0px !important ;
	}
}

@media screen and (max-width: 250px)and (min-width: 35px) and (max-height: 480px) {
.home.custom-header-media {
	
			height: 50px !important;
	}

	.home.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
		height: 10vw;
		margin-top: -240px !important;
	}

	.home.logged-in .wp-custom-header img {
		margin-top: 240px !important ;
	}
}
@media screen and (max-width: 280px) and (max-height: 480px) {
.home.custom-header-media {
	
			height: 50px !important;
	}

	.home.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
		height: 10vw;
		margin-top: -240px !important;
	}

	.home.logged-in .wp-custom-header img {
		margin-top: 240px !important ;
	}
}

这对我来说似乎很奇怪,它如何在定制器上而不是在手机上工作(如果我登录手机,它会很好地工作) 所以我在想是否有适用于手机的27个wordpress主题的css代码,可以更改并让其使用我的css版本

0 个答案:

没有答案