Web developpement

hello guys, i am new in web developpement, and i am wondered when writting a code for every kind of support ( cell phone, tablet, pc), how or what make the look or appearence different in those support, since it’s the same code we write for all of them !!!

this doesn’t have to be the case, this is where media query comes in:

@media - CSS: Cascading Style Sheets | MDN

which enable us to write different css/styling for different screen formats.

aan ok, correct me if i am wrong, so we write the code for all support in html , and in css we write different code for every support ?

No, because we do something like this:

<div class="large">
   <!-- some html code for large screens -->
</div>
<div class="medium">
   <!-- some html code for medium screens -->
</div>
<div class="small">
   <!-- some html code for small screens -->
</div>

then in css we can hide (display: none) elements which we don’t want to show. So on a large screen, we can hide the elements for other screen sizes.

all the code above is just a simplified example.

2 Likes

ok, thanks for your explanation , i got it