本文共 1507 字,大约阅读时间需要 5 分钟。
PRO 用IMG标签
- Use
IMG
plus alt attribute if the image is such as a logo or diagram or person (real person, not stock photo people). —如果图片是内容的重要部分例如logo,人员信息的头像等,用img标签,别忘了alt属性 - Use
IMG
if you intend to have people and you want the image to be included by default. —如果你想别人打印你的页面时连图片一起打印,那末用img - Use
IMG
(with alt
text) when the image has an important semantic meaning, such as . This ensures that the meaning of the image can be communicated in all user-agents, including screen readers. 如果图片有很重要的语义,例如表示警告的图标,为了保证被别的客户端设备例如屏幕阅读器所识别,那末使用IMG标签,别忘了alt属性 - Use
IMG
if you rely on to render an image in proportion to text size. 当用户改变文本尺寸比例时(通过浏览器如ctr+),使用IMG标签可以使图片正常按比例缩放 - Use
IMG
for . IE6下面多张图片交叠效果需要用IMG标签(具体用处不明) - Use
IMG
with a z-index
in order to to fill its entire window. 使用img标签以及z-index可以撑开整个窗口的背景图。(具体不知道啥意思) - Using
img
instead of background-image
can dramatically . 针对图片进行动画交互时使用img标签可显著提升性能
CON 用背景图
-
- Use CSS background images if the image . —图片不是内容的主体组成部分时,考虑用背景图
- Use CSS background images when doing eg. paragraphs/headers. —需要使用图片替代文字的时候考虑用背景图,比如标题内容、段落内容,有时候需要用更有质感的图片替代部分内容
- Use
background-image
if you intend to have people and you do not want the image to be included by default. —别人打印你的网页,你不想让他打印到图片时考虑用背景图 - Use
background-image
if you need to improve download times, as with .合图即css sprite可减少服务器请求次数,用背景图 - Use
background-image
if you need for only a portion of the image to be visible, as with CSS sprites.用背景图可以利用css的background-position控制图片的可见范围
转载于:https://www.cnblogs.com/bingya/p/3617717.html