1
モバイルエミュレータでHTML Webページを表示してコードを効率化するにはどうすればよいですか？
var Person= {};
Person.Character= function(firstName, lastName, gender, age)
{
this.FirstName= firstName;
this.LastName= lastName;
this.Gender= gender;
this.Age= age;
}
Person.Character.prototype.GetAllInformation= function()
{
return this.FirstName + " " + this.LastName + " " + this.Gender + " " +
+ this.Age;
}
Person.Zack = new Person.Character("Zack", "Efron", "Male", 29);
Person.Shia = new Person.Character("Shia", "Labeouf","Male", 30);
document.getElementById("demo1").innerHTML = Person.Zack.GetAllInformation();
document.getElementById("demo2").innerHTML = Person.Shia.GetAllInformation();@media screen and (max-width: 320px)
{
#demo1{ width: 100px;}
#demo2{ width: 100px;}
}
@media only screen and (orientation: portrait) {
body {
background-color: red;
}
}<html>
<head>
<meta name="viewport" content="width=device-width">
<title></title>
<link rel="stylesheet" type="text/css" href="example-style.css">
</head>
<body>
<p id= "demo1"></p>
<p id= "demo2"></p>
<script src="script.js"></script>
</body>
</html>みなさん、こんにちは、
は、私はモバイルエミュレータ上で私のWebページを表示したとき、私は幅を小さくする場合、Webページやメディアクエリを処理するために使用CSSは、そう、それがアクティブになります作成しました画面のサイズ、または画面をポートレート形式にしたときに表示されます。だから、基本的に私はエミュレータでHTMLを見ることができます（このウェブサイト（http://www.mobilephoneemulator.com/）で動作するようには見えません）。私は彼らがこれまでのところ正しいことを知っていますが、2つのメディアクエリを1つのメディアクエリに組み合わせる方法はありますか？これは私がCSSで持っているコードを減らすでしょう。今まで私がHTML、CSS、およびJavaScriptで行ったコードを、誰もが見るために付け加えました。デスクトップ上でモバイルとしてのあなたのウェブサイトを閲覧する方法
ようこそStackOverflow！ – Zze