HTML&CSS课程之图像与链接使用技巧

  • A+
所属分类:Web前端
摘要

常用格式:jpeg=jpg png gif比较大的图片推荐使用jpg格式,ps导出成web格式,建议选择品质80,或者不低于60

常用格式:jpeg=jpg png gif

比较大的图片推荐使用jpg格式,ps导出成web格式,建议选择品质80,或者不低于60

PNG无损压缩,图片会较大。多用于透明底的小图标

如果字体库里有图标,优先选择字体图标;如果没有的话,就选择png、

gif 动画特性

 

图片最佳存储方式:(视频同理)

第三方云服务,对方会做cdn加速

按量付费

 

超链接使用技巧:

    <a href="http://www.houdunren.com" target="_blank" title="提示文字">这是一个超链接</a>      <!-- target可以使用一个已经打开的窗口 -->     <a href="http://www.houdunren.com" target="baidu" title="提示文字">这是一个超链接</a>      <script>         // 使用js打开一个新窗口,并且命名为baidu         window.open('http://www.baidu.com','baidu');     </script>

 

锚点生产使用案例:

    <a href="#footer">锚点</a>      <div style="height:3000px;background:lightgreen;"></div>      <footer id="footer">footer</footer>      <div style="height:3000px;background:lightblue;"></div>

 

其他页面的锚点也可以

<a href="2.html#footer">锚点</a>

 

可以通过一些js的库实现平滑过渡的效果

 

链接的其他使用技巧:

    <a href="mailto:[email protected]">发送邮件</a>      <a href="tel:111xxxxxxxx">移动端会自动打开拨号面板</a>      <a href="image.jpg">浏览器默认会打开图片,可以通过后台设置为点击直接下载</a>      <a href="image.psd">点击直接下载</a>