Question

我想制作一个移动响应式电子邮件挤压页面。到目前为止，我有以下代码：

＆＃13;

public static final String ENGLISH = "en_word";
public static final String TABLE_NAME = "words";

    String sql = "SELECT * FROM " + TABLE_NAME +
                    " WHERE " + ENGLISH + " LIKE ? ORDER BY LENGTH(" + ENGLISH + ") LIMIT 100";

            SQLiteDatabase db = initializer.getReadableDatabase();

            Cursor cursor = null;
            try {
                cursor = db.rawQuery(sql, new String[]{"%" + englishWord.trim() + "%"});

                List<Bean> wordList = new ArrayList<Bean>();
                while(cursor.moveToNext()) {
                    String english = cursor.getString(1);
                    String mal = cursor.getString(2);
                    wordList.add(new Bean(english, mal));
                }

                return wordList;
            } catch (SQLiteException exception) {
                exception.printStackTrace();
                return null;
            } finally {
                if (cursor != null)
                    cursor.close();
            }

＆＃13;

这会使我的页面响应，但在桌面计算机上，它还会将表单缩放到屏幕边缘。我希望桌面视图在屏幕中间以固定宽度显示表单，当移动设备/平板电脑设备查看页面时，我希望将表单缩放到屏幕边缘。

我该怎么做？

我使用w3.css

Answer 1

在CSS中使用@media屏幕。

@media screen and (max-width: 990px) /* For screen below 990px */
     CSS here...
@media screen and (max-width: 1200px) /* For screen below 1200px */
     CSS here...



@media screen and (min/max size) /* @media(CSS rule) screen(Media Type) and(&) */

@media的原因是定义您的CSS样式以匹配screen尺寸。因此，使其响应。点击此处了解详情：@media 您可能需要覆盖一些w3.css规则。

如何使我的目标网页对表/移动访问者有不同的规则？

1 个答案: