如何将CSS设置为移动网站

Question

What style settings I need to set for webpage custom mobile browsing What setting I need to give pages What are settings I need to set the input boxes , buttons or select item ?

Should I set size in percentage or unit side?

Answer 1

For mobile web, there are few aspects to be understood.

1) use viewport to set size of website on device for example,

<meta name="viewport" content="width=device-width" />

will set size of website according to size of device.

2) make pages short and sweet, Less yet effective content.

3) Use media queries to adjust content.

4) Your designing should be responsive. Use percent and em values rather than fixed pixel values.

Here are few links for more information.

http://designshack.net/articles/css/quick-tips-for-creating-a-mobile-optimized-site/

http://designshack.net/articles/css/quick-tips-for-creating-a-mobile-optimized-site/

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

Answer 2

If your asking about a responsive flow you want percentage. However it's more complicated. Maybe start reading here. http://jquerymobile.com/demos/1.3.0-beta.1/docs/demos/grids/rwd-basics.html

Not pushing jquery mobile, but it's a good starting place.

Answer 3

Your question isn't clear but from what you have written, I presume you are looking for Responsive Websites.You can have a look at http://getbootstrap.com/ . Responsive Web design allows for a website to be properly viewed from Mobile and other devices.

Also have a look at CSS media queries ( @media ).