Testing Screen Size [Type] While designing with bootstrap
While designing webpage with bootstrap 3, you can add an extra `row` to check that what kind of screen you are using now. Add the following html but don't forget to remove when you complete you design.
This code will display which screen are you using now. For example if you are on large screen, it will display `LG`, on medium screen it will display `MD` , on small devices like Tablets, it will show `SM` and on Extra Small devices like Mobile phones screens it will display `XS`
While designing webpage with bootstrap 3, you can add an extra `row` to check that what kind of screen you are using now. Add the following html but don't forget to remove when you complete you design.
<div class="row">
<div class="col-lg-4 col-lg-offset-4 visible-lg">LG</div>
<div class="col-md-4 col-md-offset-4 visible-md">MD</div>
<div class="col-sm-4 col-sm-offset-4 visible-sm">SM</div>
<div class="col-xs-4 col-xs-offset-4 visible-xs">XS</div>
</div>
This code will display which screen are you using now. For example if you are on large screen, it will display `LG`, on medium screen it will display `MD` , on small devices like Tablets, it will show `SM` and on Extra Small devices like Mobile phones screens it will display `XS`
No comments:
Post a Comment