您好,欢迎来到爱若养生。
搜索
您的当前位置:首页如何实现chrome浏览器新标签页的效果_html/css_WEB-ITnose

如何实现chrome浏览器新标签页的效果_html/css_WEB-ITnose

来源:爱若养生
 CSS Chrome

我想做一个类似chrome浏览器 新标签页的效果

遇到有3个问题,望大家指导

1.超链接
上面是图片 下面是文字
点中图片和文字都可以跳转到指定页面

可是我看标签下不能使用标签
这种效果如果做出

是不是该这样?





  • 2.图片自适应窗口大小
    看了网上许多图片自适应窗口的例子
    可是chrome这种效果还是模拟不出

    3.点击超链接图片时
    会有深灰色背景
    这种效果css怎么做出


    回复讨论(解决方案)

    1.就那样就行
    2.body尺寸设为百分比,img尺寸设为百分比,就是说img及其上级标签都未百分比尺寸就可以了
    3.用半透明的层遮盖一下不就有灰色效果了

    1.就那样就行
    2.body尺寸设为百分比,img尺寸设为百分比,就是说img及其上级标签都未百分比尺寸就可以了
    3.用半透明的层遮盖一下不就有灰色效果了

    继续请教

    针对问题2. 我也是用百分比设置尺寸
    可是我发现 chrome浏览器在最大化和普通窗口下的图片长度占的百分比会不一致
    这是怎么实现的?

    针对问题3. 能告诉再详细点吗,我不是很明白

    1.就那样就行
    2.body尺寸设为百分比,img尺寸设为百分比,就是说img及其上级标签都未百分比尺寸就可以了
    3.用半透明的层遮盖一下不就有灰色效果了

    3 我做出来了
    用opacity设置透明度

    2 还是有疑惑


    1.就那样就行
    2.body尺寸设为百分比,img尺寸设为百分比,就是说img及其上级标签都未百分比尺寸就可以了
    3.用半透明的层遮盖一下不就有灰色效果了

    3 我做出来了
    用opacity设置透明度

    2 还是有疑惑

    用meta 改一下不同宽度调用的CSS文件


    1.就那样就行
    2.body尺寸设为百分比,img尺寸设为百分比,就是说img及其上级标签都未百分比尺寸就可以了
    3.用半透明的层遮盖一下不就有灰色效果了

    3 我做出来了
    用opacity设置透明度

    2 还是有疑惑
    实在不行就window的resize事件中js获取页面的尺寸,然后设置img的width,height,并不复杂,js获取页面尺寸的代码百度搜一下就有了



    1.就那样就行
    2.body尺寸设为百分比,img尺寸设为百分比,就是说img及其上级标签都未百分比尺寸就可以了
    3.用半透明的层遮盖一下不就有灰色效果了

    3 我做出来了
    用opacity设置透明度

    2 还是有疑惑
    实在不行就window的resize事件中js获取页面的尺寸,然后设置img的width,height,并不复杂,js获取页面尺寸的代码百度搜一下就有了

    ok
    我另外查了网上,还可以用js获取屏幕尺寸,调用不用的css
    问题解决,谢谢

    Copyright © 2019- areg.cn 版权所有

    违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

    本站由北京市万商天勤律师事务所王兴未律师提供法律服务