Geek asks and answers

Change HTML 5 and CSS style to fit the screen

Sorry if this post has too many questions, but because I am weak in web design, but I want to make this effect on my website, could you please tell me how to do this?

First ... Please visit this site http://net.tutsplus.com/

Question 1: Can I find out how I can make the resize effect in Asp MVC 3? when our site has received a sidebar user screen size of less than 1280x800, it will display one sidebar column. When a user's screen size is greater than 1280x800, it displays two columns of the sidebar.

Question 2: when the screen size is too small, only about 20 pixels of margin will be displayed on the left side of the site. All image and background will be hidden. just like when resizing your browser when opening the nettuts website.

+3
source share
3 answers

The best way to customize the page layout relative to the size of the viewport on which it is displayed is through CSS Media queries. Before you do anything, read the following:

http://www.alistapart.com/articles/responsive-web-design/

This is practically the Bible on this subject.

After that, let the spec read:

http://www.w3.org/TR/css3-mediaqueries/

The smaller CSS framework comes with a set of useful media queries, and I use it as a very simple structure:

http://lessframework.com/

+5

: , . , , .

, , , , , , .

.

+2

Answer to question 1 This is not ASP, but JavaScript. Basically, you will need a script that runs every time the browser is resized. Then it should check the new width of the viewport and change some of the CSS for the sidebar

+1
source

More articles:


All Articles