There are several ways you can send a separate set of styles to different devices or screen sizes. This is the point where you have to make a decision on what changes you want to make to your site when it is viewed on a mobile device.
This is the fastest and easiest way to move your styles from the page to an external stylesheet. If you select all the styles in the first Current Page you can drag them down to the responsive.css page. Finally, you will see an empty "responsive.css" section. The second "Current Page" section applies to the conditional IE 8 and lower styles. The first "Current Page" section refers to all the styles that we created for page layout and the existing menu. Now when you look in the Manage Styles panel you will see three sections. This will create the link to the external styelsheet for you. Now from the Folder list grab the newly created stylesheet with your mouse and drag it over the design portion of your open page in the document window and drop it. In this case I've named it "responsive.css". Typically I would name by stylesheet the same as the website. To do that right click on the local site folder you are working in and create a new empy css file. To accomplish this the first thing I would do is to move the existing styles to an external stylesheet. Then create the styles so that when viewed on a cellphone or other device. I'm going to begin with the CSS 3 Horizontal menu tutorial.
MICROSOFT EXPRESSION WEB 4 TUTORIALS HOW TO
Given the interest in responsive design I've been seeing I thought I'd show you how to create a simple horizontal menu that turns into a stacked vertical menu on cellphones and other small format devices.
0 kommentar(er)
