我终于在手机,风景和肖像上工作过我的网站,但我仍然无法在平板电脑上工作!如何让我的网站在平板电脑上工作?
我用媒体查询,使在手机上我的网站的工作,这是我做的:
@media screen and (max-width: 1024px) {
\t
\t body{
\t \t position: relative;
\t \t left: 100px;
\t }
\t .pintro{
\t \t position: relative;
\t \t top: 180px;
\t \t width: 500px;
\t }
\t .hintro{
\t \t position: relative;
\t \t top: 180px;
\t }
\t
/* The rest of my code */
}
@media screen and (max-width: 1024px) and (max-height: 400px) {
\t body{
\t \t font-family: 'Noto Sans', sans-serif;
\t \t background: url("nature-blur-tree-greenex.jpg") no-repeat center center fixed;
\t \t width: 100%; \t
\t \t max-width: 900px;
\t \t margin: 0 auto;
\t \t position: relative;
\t \t right: 8%;
\t }
\t
\t .pintro{
\t \t position: relative;
\t \t line-height: 50px; \t \t
\t \t left: -100px;
\t }
\t /* The rest of my code */
}
然后我想这样做,随着平板电脑,在这种形式:
@media only screen and (min-device-width: 768px){
\t .footer{
\t \t position: reltive;
\t \t top: 1000px;
\t }
}
但是,这并没有奏效。如果有人向我提供媒体查询,我可以将其放入我的CSS以供我的网站使用平板电脑,我将不胜感激。
感谢。
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/ –
你提的问题是非常广阔。有很多可能的答案。考虑根据您网站的内容管理您的断点:http://stackoverflow.com/q/8564752/3597276 –
谢谢伊莎贝尔公司,您的链接非常有用,它的工作。 – Ned29