欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

新人问:html中不同尺寸的显示器,显示的效果不一样,怎么解决?_html/css_WEB-ITnose

程序员文章站 2022-04-25 13:55:48
...
刚学的网页设计,在学html中,我做了一个页面,把宠物的信息放上去。可是在14.6寸的笔记本看来是正常的,拿到19寸的显示器来看就歪曲了。
如果改好了,在19寸的显示器看起来是正常的,拿到笔记本看起来就很别扭,有什么函数或者什么标签之类的,可以随着显示器的变化而自动改变尺寸么?
代码如下:
	我的宠物

新人问:html中不同尺寸的显示器,显示的效果不一样,怎么解决?_html/css_WEB-ITnose


Jerry

新人问:html中不同尺寸的显示器,显示的效果不一样,怎么解决?_html/css_WEB-ITnose

年龄:1.2岁
最喜爱的食物:鱼,热狗
特点:好动,活泼,上房下梁


更新宠物日志:


2014年12月20号:
今天的天气很好,所以带jerry去鱼梁河钓鱼,一路上,看到美丽的田边开满了
花儿,天边的云,映着彩霞的分红,好美一副景象。


效果截图如下:


回复讨论(解决方案)

sorry,上面的两张都是笔记本的效果,我放错图片了,下面是19显示器的效果:

w与h 尽量不要设置成固定的值,而是以百分比的形式设置。

align="right"
这个影响的,现在都用html和css分离的,你这种写法不好,已经过时了,还是多学习一下css吧。

宽高要成比例

宽度尽量用%;
@media screen and (max-width: 480px){

}
@media screen and (max-width: 960px){

}
或者单独定义样式

align="right"
这个影响的,现在都用html和css分离的,你这种写法不好,已经过时了,还是多学习一下css吧。

好的。多学哈哈css。

宽度尽量用%;
@media screen and (max-width: 480px){

}
@media screen and (max-width: 960px){

}
或者单独定义样式

嗯,学习了。

传统方法就是最外层固定宽度的盒子居中,左右留背景。
也可以用响应式的布局,简单的地方用百分比去排版,复杂的地方用css3的媒体查询重定样式。