Я создал html-приложение, имеющее форму для некоторых устройств с разрешением смартфона (460 x 320 пикселей), и он отлично выглядит на моем смартфоне. Когда я запустил его на своем Android-планшете (который представляет собой вкладку Samsung Tab размером от 1024 x 600 пикселей), фоновое изображение приложения было разбито/повторено. Мне удалось удалить повторяющееся фоновое изображение с помощью background-Repeat:no-repeat;, но теперь у меня осталось много свободного места внизу и справа от приложения, где было повторное изображение. Я не уверен, что это за пустое пространство. Является ли это видовым окном макета, или холстом, полями, дополнением или чем-то еще?Как удалить пробел вокруг моих html-форм?
Я хочу, чтобы уменьшить пробел до того же размера, что и форма, потому что, когда я изменяю размер (больше) своих будущих приложений для смартфона для планшетов, мне нужно одно приложение для всех размеров планшетов, независимо от большего разрешения планшеты могут работать. Ниже страница показывает, как приложение рода выглядит на моем планшете, но вместо желтого пространства, есть пустое пространство: https://developer.mozilla.org/it/docs/DOM/element.clientHeight
Я пробовал некоторые настройки с помощью CSS, мета окно просмотра, window.resizeTo и window.resizeBy , Кроме того, я прочитал на screen.height, outerHeight, outerWidth, offsetWidth, clientHeight и clientWidth, но я не знаю, куда эти команды должны идти в html приложения, или даже если они будут иметь какое-либо влияние. Window.resizeTo(320,460) вид работал на рабочем столе Safari, но не на рабочем столе Chrome. Window.resizeTo не повлиял на мой Android-планшет, было ли приложение запущено как html-файл (независимо от того, какой браузер использовался) или как .apk.
Мне сказали, что изменение размера мобильного браузера/пробела (которое когда-либо можно назвать) невозможно, но я отказываюсь верить в это. Если это действительно невозможно, есть ли что-то еще, что я могу сделать с белым пространством, например, сделать его прозрачным или изменить его на другие цвета в соответствии с моими приложениями? Или, есть ли другая альтернатива, которую я мог бы попробовать?
В качестве примера, приложение для плеера для Android-планшета Android имеет функцию, которая позволяет ей быть меньше, чем полный экран. Разумеется, это можно сделать с помощью html-приложения, использующего html5, Phonegap, Android API, CSS, webview и т. Д. Вместо лишнего пробела. См. Пример здесь: http://www.youtube.com/watch?v=2swd06TNYXc
Ниже приведен пример html для формы примера.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Tablet Test</title>
<meta name="generator" content="WYSIWYG Web Builder 8 -
http://www.wysiwygwebbuilder.com">
<meta name="viewport" content="width=device-width; initial-scale=1.0;
maximum-scale=1.0; user-scalable=0;">
<style type="text/css">
body
{
font-size: 8px;
line-height: 1.1875;
background-color: #FFFFFF;
color: #000000;
}
</style>
<style type="text/css">
a
{
color: #0000FF;
text-decoration: underline;
}
a:visited
{
color: #800080;
}
a:active
{
color: #FF0000;
}
a:hover
{
color: #0000FF;
text-decoration: underline;
}
</style>
<style type="text/css">
#wb_Form1
{
background-color: #1E90FF;
border: 0px #000000 solid;
}
#TextArea1
{
border: 1px #C0C0C0 solid;
background-color: #FFFFFF;
color :#000000;
font-family: Arial;
font-size: 13px;
text-align: left;
}
</style>
</head>
<body>
<div id="wb_Form1"
style="position:absolute;left:0px;top:0px;width:320px;height:460px;z-in
dex:3;">
<form name="Form1" method="" action="" enctype="text/plain" id="Form1">
<textarea name="TextArea1" id="TextArea1"
style="position:absolute;left:112px;top:106px;width:98px;height:98px;z-
index:1;" rows="5" cols="11"></textarea>
<button id="AdvancedButton1" type="button" name="" value=""
style="position:absolute;left:86px;top:364px;width:150px;height:34px;z-
index:2;"><div style="text-align:center"><span
style="color:#000000;font-family:Arial;font-size:13px">Send</span></div
></button>
</form>
</div>
</body>
</html>
Кажется, что слишком много текста для такого вопроса. Попробуйте и уточните свой вопрос –
или по крайней мере a tl; dr = P –
[Удаление ненужных узлов из DOM] (http://www.sitepoint.com/removing-useless-nodes-from-the-dom/) – Givi