CSS 文字替代图片下载失败情况 - 田军的专栏 - ITeye博客

`

tianjun309

浏览: 367366 次
性别:
来自: 深圳

最近访客更多访客>>

seavisiocode

u011045451

caiman0827

fly_mans

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

hijackwust：最次的方法，没有之一
让一个工程并存jar包不同版本
手写白： ...
让一个工程并存jar包不同版本
wqsmd1：连接不会关，怎么弄
Struts2 + JasperReports4 + DB2 Demo
tntxia：楼主，怎么没有放keymaker.jar这个包啊
Aqua Data Studio 破解及解决乱码说明
mrsea2010：楼主，按照你的方法，点击联接，我都不能显示出页面，直接报404 ...
Struts2 + JasperReports4 + DB2 Demo

CSS 文字替代图片下载失败情况

博客分类：

html & Css

CSS XHTML HTML XML

阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" > 
 <head><title>Text Replacement</title>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" href="site.css"   media="all"    type="text/css" />
  <link rel="stylesheet" href="page.css"   media="all"    type="text/css" />
 </head>
 
 <body>
 
 <h1>Text Replacement</h1>
 <h2 id="h2" >Heading ddd2<span></span></h2>

 </body>
</html>

CSS:

#h2 {
    position: relative;
    width: 250px;
    height: 76px;
    overflow: hidden;
}
/*
* span里面的图片和h2中字的长宽一样，如果当图片显示不出来时候，自然就是字来充当
*/
#h2 span {
    position: absolute;
    width: 250px;
    height: 76px;
    left: 0;
    top: 0;
    background: url("heading2.jpg") no-repeat;
}

分享到：

通过position将div中的内容移出显示 | CSS 2.0样式表中文手册

2010-12-02 23:44
浏览 984
评论(0)
分类:Web前端
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

掉链图片的替代图片方法特效代码: 这样，当原图加载失败时，CSS选择器`.image.error + .fallback-image`会让替代图片显示出来。 5. 使用帮助： - 确保替代图片URL是可访问的，并且在代码中正确设置。 - 对于多个图片，可以将上述JavaScript代码...

html语言全集包括框架图片文字设计: 我们需要指定`src`属性来提供图片的URL，`alt`属性提供图片的替代文本，这对于视觉障碍的用户和加载失败时的显示非常重要。此外，还可以使用`width`和`height`属性控制图片尺寸。至于“表格设计”，HTML的`<table>...

文字超出限制在末尾加省略号，showToast消息提示接口,在图片未能正确加载时显: 常见的做法是在图片未能正确加载时，显示一个友好的错误提示，或者提供一个备选的替代图片。 4. **技术实现说明**：文档中提到的技术实现细节可能包含两个方面： - 文本超出限制时添加省略号，这通常是通过编程...

CSS 背景属性5个应用实例.: 为了解决这个问题，实例4则引入了一个额外的标签并通过定位将背景图片置于文字之上，这样即使图片下载失败，仍能保留基本的文本内容。接下来，第三个实例展示了自适应按钮的制作。传统的做法是为不同长度的按钮...

CSS样式中文语法名令完全注释.pdf: 本篇将详细解析CSS中的字体属性，帮助你更好地理解和运用这些命令，让你的网页文字更加美观。 1. **font-family** 属性用于指定文本的字体。你可以提供一个字体列表，浏览器会按照顺序尝试使用这些字体。例如，`...

ext img 选择: 其次，`img`组件还支持其他配置，如`width`和`height`来设置图片尺寸，`alt`提供替代文本，`cls`用于添加自定义CSS类以实现样式定制。例如： ```javascript items: [{ xtype: 'image', src: 'path/to/your/image....

shendiaoxialv.zip_shendiaoxialv: `<img>`标签的`alt`属性提供了图片的替代文本，对于访问障碍用户和加载失败时非常有用。同时，优化图片大小和格式（如使用JPEG、PNG或SVG）能提高页面加载速度。 4. 页面布局：一个常见的布局策略是使用网格系统，...

wordpress整合ueditor下载wp-ueditor2: UEditor是由百度开发的一款开源的JavaScript富文本编辑器，它提供了强大的文字编辑、图片上传、多媒体插入等功能，让网站的内容创建变得更加便捷。其特色包括简洁的界面、良好的性能以及对各种浏览器的良好兼容性。 ...

javascript-image_alternate_text:返回图像的替代文本: `alt`属性的值通常是对图像内容的文字描述，当图像无法显示或加载时，浏览器会显示这个替代文本。此外，搜索引擎也依赖`alt`文本来理解图片的内容。在JavaScript中，你可以通过以下方式获取图像元素的`alt`文本： ...

js钢琴按钮波浪式图片排列效果代码分享: 1. 定义图片容器的CSS样式，确保图片能够正确排列。 2. 创建一个JavaScript对象`Bookrack`，定义缩放比例、图片间距等参数。 3. 初始化图片数组，监听鼠标悬停事件。 4. 当鼠标移到图片上时，计算相邻图片的缩放比例...

editplus 代码编辑器html c++ jsp css: 由于基本无法编辑录制的文件，所以录制的时候为了避免录制失败，推荐纯粹使用键盘操作，以下是比较关键的几个键盘组合： Ctrl+F ＝调出查找对话框 Ctrl+H ＝调出替换对话框 Alt+F4 ＝关闭作用，比如，关闭查找...

HTML面试题: 1. **`alt`属性**: 当图像无法显示时（例如网络连接失败或用户使用屏幕阅读器），`alt`属性会显示替代文本。这对于提高网页的可访问性至关重要。 2. **`title`属性**: 提供了关于元素的建议性信息，当鼠标悬停在元素...

html.zip_简单的网页html: 标签则用于插入图片，src属性指定了图片的路径，alt属性提供图片的替代文字，以便于屏幕阅读器或图片加载失败时使用。 5. 列表：HTML提供了无序列表()和有序列表()，以及列表项()。无序列表用圆点表示，有序列表则...

常用HTML标记使用技巧 HTML标记: - `<img>` 标记插入图片，`src` 属性指定图片源，`alt` 提供图片的替代文字，用于屏幕阅读器或者图片加载失败时。 6. **列表标记**： - `<ul>` 和 `<li>` 用于创建无序列表，而 `<ol>` 和 `<li>` 用于创建有序...

HTML网页设计指导: 例如，`描述性文字">`用于插入图片，`src`属性指定图片源，`alt`则提供替代文本，对于视觉障碍的用户或加载失败时尤其重要。此外，HTML5引入了许多新的元素，如`<header>`、`<footer>`、`<section>`、`<article>`...

pictures.portfolio: 它的`src`属性指定图片的URL，`alt`属性提供图片的替代文本，以供屏幕阅读器或加载失败时使用。例如： ```html 图片描述"> ``` 3. **布局与样式**：为了美观地展示图片，可以使用`<div>`或`<figure>`元素进行...

jQuery实现的表单提交滑动验证实例特效源码.zip: 滑动验证通常用于替代传统的验证码，用户需按照一定的轨迹滑动一个小块来完成验证，这种方式既简单又直观，减少了用户输入文字的麻烦。在这个实例中，我们将会看到如何使用jQuery和可能的一些CSS及HTML来实现这个...

《网页制作》理论试题及答案.pdf: 20. **图像替代文本（Alt属性）**：`<img>`标签的`alt`属性提供替代文本，当浏览器不支持图像或图像加载失败时显示。 21. **删除站点**：在Dreamweaver中，删除站点只断开了本地文件与站点的关联，文件本身并未删除...

jquery uploadify 实现批量上传，带进度显示，判断文件大小: 在IT行业中，前端开发经常会...首先，你需要在项目中下载`jQuery Uploadify`的压缩包，包含`uploadify.css`样式文件和`uploadify.js`脚本文件。在HTML文件中引入jQuery库和Uploadify的JavaScript及CSS文件： ```html ...

Global site tag (gtag.js) - Google Analytics