Ask the boss to give me some guidance for this newcomer.

I am a sophomore majoring in computer science. I learned the web front end after seeing the great special effects on the Internet, but I went through the css foundation, but I always couldn"t write a good-looking page, and I didn"t know how to start it. Recently, when I imitated a website and visited another website, I found that other people"s websites were self-adaptive and changed directly from the pc side to the mobile layout. What I currently know about bootstrap is a responsive framework. Is there any special way for people to write two sets of css to load different css on different terminals through user agent inspection? ask the boss for advice. As far as I know about this method of media inquiry,

1. If I write the pc page code, write the navigation bar, after querying with the media, switching to the mobile will be adaptive, then the original written margin, ah, padding, what to do I directly gave to the px unit.
2. What kind of layout is popular at present.

Apr.12,2022

now the mature compatibility is better. Pc websites generally use media queries.

of course, you can do a lot of articles on layout. Flex layout can already meet the needs of most scenarios.

as for wanting to use a set of styles to be compatible with pc and to ensure that the mobile terminal is not messy, the simpler ones can be more complex than writing a large number of media queries. It is better to write two sets of styles directly, and it is also convenient for later maintenance

.

you can use bs to deal with what you call pc/ mobile, and px has nothing to do with what you say.
from pc to mobile, the layout of the page should be changed from three columns to two columns, two columns to one column, and one column cannot be displayed. It is necessary to make a choice and hide the unimportant information.
after the layout has been changed, the order of the modules will naturally be changed. By modifying the order of flex, you can raise the key content.
another key to self-adaptation is the size of the gap. It just so happens that a set of padding and margin of bs also has a responsive type

.
Menu