以下内容为Stackoverflow上整理以作纪录
PRO 用IMG标签
- Use
IMGplus alt attribute if the image is part of the content such as a logo or diagram or person (real person, not stock photo people). —sanchothefat如果图片是内容的重要部分例如logo,人员信息的头像等,用img标签,别忘了alt属性 - Use
IMGif you intend to have people print your page and you want the image to be included by default. —JayTee
如果你想别人打印你的页面时连图片一起打印,那末用img - Use
IMG(withalttext) when the image has an important semantic meaning, such as a warning icon. This ensures that the meaning of the image can be communicated in all user-agents, including screen readers.
如果图片有很重要的语义,例如表示警告的图标,为了保证被别的客户端设备例如屏幕阅读器所识别,那末使用IMG标签,别忘了alt属性 - Use
IMGif you rely on browser scaling to render an image in proportion to text size.
当用户改变文本尺寸比例时(通过浏览器如ctr+),使用IMG标签可以使图片正常按比例缩放 - Use
IMGfor multiple overlay images in IE6.
IE6下面多张图片交叠效果需要用IMG标签(具体用处不明) - Use
IMGwith az-indexin order to stretch a background image to fill its entire window.
使用img标签以及z-index可以撑开整个窗口的背景图。(具体不知道啥意思) - Using
imginstead ofbackground-imagecan dramatically improve performance of animations over a background.
针对图片进行动画交互时使用img标签可显著提升性能
CON 用背景图
- Use CSS background images if the image is not part of the content. —sanchothefat
图片不是内容的主体组成部分时,考虑用背景图 - Use CSS background images when doing image-replacement of text eg. paragraphs/headers. —sanchothefat
需要使用图片替代文字的时候考虑用背景图,比如标题内容、段落内容,有时候需要用更有质感的图片替代部分内容 - Use
background-imageif you intend to have people print your page and you do not want the image to be included by default. —JayTee
别人打印你的网页,你不想让他打印到图片时考虑用背景图 - Use
background-imageif you need to improve download times, as with CSS sprites.
合图即css sprite可减少服务器请求次数,用背景图 - Use
background-imageif you need for only a portion of the image to be visible, as with CSS sprites.
用背景图可以利用css的background-position控制图片的可见范围
以下内容为Stackoverflow上整理以作纪录的更多相关文章
- GitHub上整理
GitHub上整理 技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 infoq:企业级应 ...
- [转帖]GitHub上整理的一些工具
GitHub上整理的一些工具 技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 inf ...
- 为什么 StackOverflow 上的代码片段会摧毁你的项目?
昨天公司里碰到一件令人哑然失笑的事情.帮朋友公司做的一个项目,做SIT测试的时候发现一些bug,仔细查了下原因,原来是因为当初觉得这个项目比较简单,交给了几个新入职的新丁,也算是给他们练练手,结果其中 ...
- 老码农教你在 StackOverflow 上谈笑风生
作为一个高大上的码农,你肯定用到过 StackOverflow,必须的.会有人否定这个断言么?那他恐怕不是真正的码农,或者说还没入门.StackOverflow 对于码农的重要性,基本就和诸葛亮对刘备 ...
- stackoverflow上关于iOS的票数最多(最常见)的15个问题
搞编程做项目的,没碰到bug.遇到问题,基本不可能.stackoverflow就是一个大型的开放的FAQ平台,你是问题制造者,也是答案提供者.本文列出至今stackoverflow上关于iOS的票数最 ...
- Stackoverflow上有哪些声望高or值得关注的国人
Stackoverflow上有哪些声望高/值得关注的国人? 以下回答并不严格按照 Reputation 排名来列,也不收录不确定是Chinese(中国人或华人)的用户,欢迎补充- 1.李杨 @Li L ...
- 记一次在StackOverFlow上问问题的经历
最近一直在做测试方面的事情,被测的一些功能需要连接到FTP服务器上.而我在做本地测试时为了方便,就使用java写了一个简单的ftp服务器,可以在命令行下直接启动运行. 当时在main函数里是这样写的. ...
- 我发现:在StackOverflow上拯救歪果仁十分有意思!
菊长:火星特工们!今天是周五了,大家有什么提议? BeJavaGod:报告菊长!我发现,在StackOverflow上拯救歪果仁十分有意思! 噗哈哈,时不时遇到问题会使用到StackOverflow, ...
- TOGAF架构内容框架之内容元模型(上)
TOGAF架构内容框架之内容元模型(上) 2. 内容元模型(Content Metamodel) 在TOGAF的眼中,企业架构是以一系列架构构建块为基础的,并将目录.矩阵和图形作为其具体展现方式.如果 ...
随机推荐
- [How to]基于本地镜像的yum镜像源搭建
1.简介 本文介绍如何在封闭环境(无外网)下安装离线安装本地镜像与基于本地镜像的yum镜像源. 2.环境版本交代: OS:CentOS-6.7-x86_64-minimal yum: yum-3.2. ...
- scrapy框架搭建与第一个实例
scrapy是python的一个网络爬虫框架,关于它的介绍有很多资料,这里不做过多介绍(好吧我承认我还不是很懂...).我现在还在摸索阶段,因为用scrapy爬取的第一个网站非常简单,不涉及登陆.验证 ...
- 类似于input输入框placeholder的效果,兼容ie8
$(function(){ //判断浏览器是否支持placeholder属性 supportPlaceholder='placeholder'in document.createElement ...
- linux命令(15):mount/umount命令
使用挂盘之前可以先使用fdisk -l查看硬盘分区情况. 命令格式: mount [-t vfstype] [-o options] device dir -t vfstype 指定文件系统的类型.常 ...
- redis 安装配置
reids 安装配置 1.1 下载软件包 [root@node01 ~]# mkdir -p /data/src/ [root@node01 ~]# cd /data/src/ [root@node0 ...
- LeetCode解题报告—— Rotate List & Set Matrix Zeroes & Sort Colors
1. Rotate List Given a list, rotate the list to the right by k places, where k is non-negative. Exam ...
- aliyun服务器ubuntu系统+MySQL+SqlDeveloper
首先按照 https://www.digitalocean.com/community/tutorials/how-to-install-mysql-on-ubuntu-16-04 https://w ...
- Sql Server递归查询(转)
有如下数据表 假如我们要查询ID为003的数据的所有子节点我们可以使用CTE 递归查询完成... if OBJECT_ID('tb','N') is not null drop table tb; c ...
- 关于自建yum源拾遗
yum参数解释[updates]--->源name=CentOS-$releasever - Updates --->源的名字baseurl=http://mirror.centos.or ...
- Python中的多进程:fork和multiprocessing
Python的多进程 套路1:os.fork() 先敲段代码: #!/usr/bin/env python3 import os os.fork() print('1111111111') 执行结果: ...