我是Html的新手。我有一个网页,我需要响应平板电脑和手机上的使用。我需要做些什么来实现这一目标。
样式:
#header {
font-size:30px;
color:white;
text-align:center;
padding-top:10px;
padding-bottom:10px;
}
</style>
HTML:
<div style="background-image:url(); height:350px; width:900px;margin-left:auto;margin-right:auto;">
<div id="header">text</div>
<div id="para">text</br>text</div>
<div id="splash_img"><img src=""/></div>
<div id="game_img"><img src="" />
<div id="video_play"><img src=""/></div>
</div>
形式:
<div id="form_container"><div id="form"><form>
<div class="form_label">Name:</div> <div class="form_input"><input type="text" name="firstname" style="width:200px; display:inline-block"></div>
<div class="form_label">Surname:</div> <div class="form_input"><input type="text" name="lastname"style="width:200px; display:inline-block"></div>
<div class="form_label">Email: </div><div class="form_input"><input type="text" name="email"style="width:200px; display:inline-block"></div>
<div style="padding-left:40px; padding-top:10px"><input type="submit" value="text"></div>
</form></div></div>
</div>
答案 0 :(得分:1)
您可以找到一些有用的库。这是一个噩梦般的代码。您确实需要从HTML中删除这些css
并将其导入css
文件。
http://angrycreative.se/modern-css-frameworks-for-desktop-tablet-mobile/
http://kyleschaeffer.com/development/responsive-layouts-using-css-media-queries/