6.0w+
社区成员
- 全部
- 问答
如何在一个td里实现css的叠层?
代码如下:
<table width="200" height="200" align="center"><!--绝对不能改变这一行内容-->
<tr><td bgcolor="#eeeeee" align="center" valign="middle">"><!--绝对不能改变这一行内容-->
<div style="background-color:red;width:180;height:180;">A</div>
<div style="background-color:blue;height:30;width:100;">B</div>
</td></tr>"><!--绝对不能改变这一行内容-->
</table>"><!--绝对不能改变这一行内容-->
我要达到的效果:
A处于td正中间
B处于td的右下角(叠层覆盖着A的一小部分)
在线等!可用立刻结贴~~多谢!
<table width="200" height="200" align="center"><!--绝对不能改变这一行内容-->
<tr><td bgcolor="#eeeeee" align="center" valign="middle">"><!--绝对不能改变这一行内容-->
<div style="background-color:red;width:180;height:180;">A</div>
<div style="background-color:blue;height:30;width:100;">B</div>
</td></tr>"><!--绝对不能改变这一行内容-->
</table>"><!--绝对不能改变这一行内容-->
我要达到的效果:
A处于td正中间
B处于td的右下角(叠层覆盖着A的一小部分)
在线等!可用立刻结贴~~多谢!
...全文
当前发帖距今超过3年，不再开放新的回复
发表回复
knowledge_Is_Life 2008-05-01
好像没那么简单,呵呵.
meiZiNick 2008-05-01
有点难度哦
一把编程的菜刀 2008-03-11
如果只是遮住那部分不让显示，那就用1楼的
一把编程的菜刀 2008-03-11
如果你遮盖住内容，不让A遮盖的部分显示出来好做
如果还想他显示出来
FF下的滤镜直接用不了
如果还想他显示出来
FF下的滤镜直接用不了
myvicy 2008-03-11
<table width="200" height="200" align="center"> <!--绝对不能改变这一行内容-->
<tr> <td bgcolor="#eeeeee" align="center" valign="middle"> <!--绝对不能改变这一行内容-->
<div style="background-color:red;width:180px;height:180px;z-index:1;"> A </div>
<div style="position:absolute;float:right;top:180px;background-color:blue;height:30px;width:100px;z-index:2;"> B </div>
</td> </tr> "> <!--绝对不能改变这一行内容-->
</table> "> <!--绝对不能改变这一行内容-->
<tr> <td bgcolor="#eeeeee" align="center" valign="middle"> <!--绝对不能改变这一行内容-->
<div style="background-color:red;width:180px;height:180px;z-index:1;"> A </div>
<div style="position:absolute;float:right;top:180px;background-color:blue;height:30px;width:100px;z-index:2;"> B </div>
</td> </tr> "> <!--绝对不能改变这一行内容-->
</table> "> <!--绝对不能改变这一行内容-->
jackker 2008-03-11
有没有符合w3c的标准写法?
hookee 2008-03-11
IE
<table width="200" height="200" align="center">
<tr> <td bgcolor="#eeeeee" align="center" valign="middle">
<div style="background-color:red;width:180;height:180;z-index:1;"> A </div>
<div style="background-color:blue;height:30;width:100;z-index:2;position:absolute;left:expression(this.parentNode.parentNode.parentNode.parentNode.offsetLeft+this.parentNode.offsetLeft+this.parentNode.clientWidth-this.clientWidth);top:expression(this.parentNode.parentNode.parentNode.parentNode.offsetTop+this.parentNode.offsetTop+this.parentNode.clientHeight-this.clientHeight);"> B </div>
</td> </tr>
</table>
CSS基础语法-选择器/优先级/继承和叠层 二、CSS基础语法 1.如何应用CSS样式 行内样式（内联样式）：在开始标签内添加style样式属性 内部样式表（嵌入样式） 外部样式表 导入式 2.样式的优先级 行内样式>内部样式>外部样式 说明！！ （1）链入外部...
DIV+CSS层叠式布局（综合篇） 相较前面的布局单一化，简单小白上手快，本次布局加入了层叠样式，以及常见的输入框和列表的使用，之前都是适应内嵌式的样式，在...2 文件内还需新建一个文件夹用以连接CSS样式 注意：文件后缀名为.htm/.html ...
CSS层叠样式表 CSS层叠样式表 回顾 1、HTML概述 Hyper Text Markup Language 超文本标记语言 作用:创建网页文档，包含文字、图片、链接、音频、视频等。 2、HTML的常用基本标签 结构标签: html head title meta body 排版...
前端三件套（一）：HTML CSS 比如说：布局，颜色，大小等等， CSS 技术实现 行为： 页面元素与输入设备交互响应 用js实现 HTML： <html> ··表示整个html页面的开始 <head> ··头信息 <tittle
css 目录一、介绍二、基础知识2.1、应用css样式表2.1.1、外部样式 一、介绍 ...一个最简单的例子： index.html: &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;!DOCTYPE html&amp;amp;a
Div + CSS (几个css元素的简单解释) 几个css元素的简单解释 div ul dl dt oldiv，这个很常见，块级元素，div尽量少用，和table一样，嵌套越少越好 ol 有序列表。 <ol> <li>……</li> <li>……</li> <li>...
CSS css基本语法样式 叠层样式表，主要用来定义HTML内容在浏览器内显示的样式。如文字大小，颜色，图片样式等。 在HTML文件中中 <title>CSS学习 ; charset = utf-8"> <sty
CSS 层叠样式表 CSS 层叠样式表（英文:Cascading StyleSheet 简称CSS） <!--引入样式表--> <link rel="stylesheet" href="css/first.css"> <!--定义css样式,作用与当前html文档--> <style> div{ color:...
CSS基础快速入门笔记 叠层:多个样式可以作用于同一个html的元素，同时生效 好处:功能强大，将内容展示样式控制分离，降低耦合度，解耦，让分工协作更容易，提高开发效率 CSS和HTML的结合方式： 注意: 1,2,3方式作用范围越来越大，1...
css文字、文本样式 目录 文字样式: 字体（font-family） 文字大小（font-size） 文字颜色（color） 文字粗细（font-weight） 文字斜体（font-style） 字体变形（font-variant） 文本样式属性: 水平对齐方式（text-align） ...
CSS的基础 css规则由两个主要的部分构成：选择器以及一条或多条声明 选择器是用于指定css样式和html标签，花括号内是对该对象设置的具体样式 属性和属性值以“键值对”的形式出现 属性是对指定的对象设置的样式属性，...
Web前端开发学习之路——初识CSS的基本功能（一） 应用CSS样式表 行内声明 <!DOCTYPE html> <html lang="en"> <head> <!--内行声明--> <meta charset="UTF-8"> &...
HTML与CSS基础 H5+CSS3 第一章：HTML基础 1，HTML简介 HTML (Hyper Text Markup Language) 超文本标记语言 超文本 不仅仅包含文本信息，还包括图片，视频，音频… 标记：用来描述超文本的标签 百度一下 语言：高级计算机语言 2，...
前端基础HTML和css总结 * 在用户本地有一个客户端程序，在远程有一个服务器端程序 * 如：QQ，迅雷… * 优点： \1. *用户体验好* * 缺点： \1. 开发、安装，部署，维护 麻烦 2.B/S: Browser/Server 浏览器/服务器端 * ...
前端—CSS层叠样式表 文章目录CSS介绍基本语法CSS页面引入方法三：外联式常用CSS样式基本选择器类选择器层级选择器组选择器伪类及伪元素选择器盒子模型CSS浮动典型布局案例 CSS介绍 1、定义 CSS指层叠样式表（Cascading Style Sheets）...
关于CSS需要知道的10件事 怎样写出可持续的CSS代码， 关于CSS你必须了解的10件事情：每个在大型项目中工作的人都应该知道对于大量增长的CSS资源保持可读性和可维护性是多么困难。样式的可重用性和松耦合。此外在响应式（RWD）web开发中还要...
html&css基础笔记 有道笔记：http://note.youdao.com/noteshare?... 一 HTML结构标签 HTML基本标签 标题标签 <h1>~<h6> 段落 <p></p> 换行 <br/> 水平线 <hr/> 粗体 <strong>&...
HTML5及CSS3基础知识（持续更新） 超文本: 比普通文本功能更加强大,可以添加各种样式 标记语言: 通过一组标签.来对内容进行描述....lt;关键字> , 是由浏览器来解释执行 ...标签：不区分大小写，但是建议... 上面是一个文档声明 <meta char...
史上最全面试题（CSS） 1.CSS 选择符有哪些？哪些属性可以继承？优先级算法如何计算？ CSS3新增伪类有那些？ 选择器：1.id选择器（ # myid）2.类选择器（.myclassname）3.标签选择器（div, h1, p）4.相邻选择器（h1 + p）5.子选择器（ul &...
几个css元素的简单解释 div ul dl dt oldiv 几个css元素的简单解释 div ul dl dt oldiv，这个很常见，块级元素，div尽量少用，和table一样，嵌套越少越好ol 有序列表。………………表现为：1……2……3……ul 无序列表，表现为li前面是大圆点而不是123…………...
CSS继承和层叠性 (1)4个基本选择器：通用选择器，id选择器，class选择器(类就是被重用的,一个标签可以有多个类,一个类可以用在多个标签上，挂类法编写样式)，标签选择器。 (2)3套复杂选择器：后代选择器(空格表示后代,多层选择，不...
几个css元素 几个css元素的简单解释 div ul dl dt oldiv，这个很常见，块级元素，div尽量少用，和table一样，嵌套越少越好 ol 有序列表。 <ol><li>……</li><li>……</li><li>……</...
htmlcss使用及html5新特性笔记整理 【css常用】 css引入类型 行内样式 结构的内部，即写在标签内的样式；写在标签的开始部分内部，...外联式是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中，通过标记将外部样式表文件链接到HTML文档中
css自学笔记 css自学笔记 1、css简介 css叫叠层样式表，是标记语言主要的使用场景美化网页，布局页面的。 ... 总结： ... 2、css美化html，布局网页。...css规则由两个部分构成：选择器及一条或者多条声明。 如：h1{col
一小时熟练使用css 关于Web标准Web标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure）、表现（Presentation）和行为（Behavior）。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现...
XML:XML文件的显示——CSS和XSL 在XML文件中，使用的基本上是自定义的标记，显然一个浏览器是无法理解这些标记的，现在，浏览器仅仅是作为一个XML文件的解析器——只要你的XML文件是Well-Formed的，那么它就将文件原封不动地给你显示出来。在XML中...
