`
sty2008boy
  • 浏览: 302373 次
  • 性别: Icon_minigender_1
  • 来自: 太原
社区版块
存档分类
最新评论

两个层并列显示DIV

    博客分类:
  • CSS
div 
阅读更多

两个层并列显示,是同底对齐的,应说明是上底对齐还是下底对齐。
上底对齐要用:float:left;<br><br>
<div style="width:234;height:99;border:1 solid red;float:left;" >ererererer</div>
<div style="width:234;height:69;border:1 solid blue;" >gfgfgfgfgf</div>
<br><br><br><br>
下底对齐要用:display:inline;<br><br>
<div style="width:234;height:99;border:1 solid red;display:inline;" >ererererer</div>
<div style="width:234;display:inline;height:69;border:1 solid blue;" >gfgfgfgfgf</div>
<br><br>
而且display:inline;的用法似乎是IE ONLY的。

分享到:
评论

相关推荐

    2个div并列

    在网页设计中,将两个`div`元素并列显示是一项常见的布局任务,这通常涉及到CSS(Cascading Style Sheets)的布局技术。标题"2个div并列"指的是如何使用CSS来实现两个`div`元素水平相邻显示。下面将详细解释这一过程...

    让两个Div并排显示的多种方法

    在网页设计中,将两个Div并排显示是一种常见的布局需求。实现这一布局有多种方法,每种方法都基于CSS的不同特性。下面将详细介绍各种实现方式及相关知识点。 一、使用display的inline属性 这种方法是通过将两个Div...

    将两个div左右并列显示并实现点击标题切换内容

    首先,我们需要在HTML中设置基本的结构,包括两个并列的div容器,以及每个容器内的标题和内容部分。例如,我们可以创建三个具有类似结构的选项卡:`#tab01`、`#tab02` 和 `#tab03`。每个选项卡都有一个标题(h3 或 ...

    js两张图片并列循环滚动

    可以创建两个`&lt;img&gt;`标签,并通过CSS设置其并列显示。例如: ```html &lt;div class="slider-container"&gt; &lt;/div&gt; ``` CSS部分则需要定义容器和图片的样式,以实现并排显示和滚动效果: ```css .slider-container...

    左右div可拖动【框架】

    1. **HTML结构**:首先,创建两个并排的`div`元素,通常使用`float: left`和`float: right`使它们并列显示。例如: ```html &lt;div id="leftDiv"&gt;&lt;/div&gt; &lt;div id="rightDiv"&gt;&lt;/div&gt; ``` 2. **CSS样式**:通过CSS...

    新手学习DIV+CSS难点之经验总结.pdf

    网页居中显示是DIV+CSS中最基本的布局要求,需要设置两个地方,一个是body,一个是外边框div。 CSS代码为: ``` body { margin: 0; padding: 0; text-align: center; } #main { width: 760px; margin: 0 auto; ...

    两个div如何并排一行具体该怎么实现

    在网页设计中,将两个或多个div元素并排显示在同一行是一种常见的布局需求。通过CSS(层叠样式表)的控制,我们可以轻松实现这一布局方式。本段内容将详细介绍如何使用HTML和CSS将两个div元素并排放置于同一行的方法...

    div的两列居中放置并对每个div设计css样式

    在本知识点中,我们将详细解读如何使用HTML和CSS来实现一个页面布局,该布局中包含一个大的容器div(id为content),它内部又包含两个左右并列的子div(分别具有id为side和main)。我们的目标是让这两个子div在大...

    新手学习DIV+CSS难点之经验总结

    要实现网页居中显示,需要从两个方面入手:一是对`body`进行设置,二是对外层的`div`进行设置。 **CSS示例代码:** ```css body { margin: 0 auto; /* 设置margin为auto可以让元素居中 */ } #outer-div { width...

    css + div网页布局终极解决方案

    在此模型中,一个父 Div 包含两个子 Div,通过 `position: absolute` 和 `position: relative` 结合,可以实现左右并列的布局。例如: ```html 无标题页 #father {width: 300px;} #left {position: absolute;...

    前端开发与实践- DIV与SPAN.pptx

    在前端开发中,`div` 和 `span` 是两个非常基础且重要的HTML标签,它们用于构建网页布局和组织内容。让我们深入探讨这两个元素以及与之相关的前端开发知识点。 首先,`div` 标签代表一个分区或节(division/section...

    采用flash+div布局精美网页

    这个名为"采用flash+div布局精美网页"的项目,显然展示了如何利用这两种技术来创建一个具有吸引力和互动性的网页。现在我们来深入探讨一下Flash和Div在网页设计中的应用及其相关知识点。 Flash,全名Adobe Flash,...

    css+div教程实例

    2. 行内布局(Inline Layout):如span元素,元素并列显示,适用于链接或文本装饰。 3. 浮动布局(Float Layout):使用`float:left`或`float:right`使元素在父容器内浮动,常用于创建多栏布局。 4. 定位布局...

    页面设计常用的方式之一div应用

    要实现两个表格并排显示,我们可以通过设置`&lt;div&gt;`的`float`属性来达到目的。`float`属性允许元素浮动到其父元素的左侧或右侧,从而使得其他元素可以围绕它布局。以下是使用`float:left`实现两个表格并排的示例: `...

    div+css 布局模板

    4. **内容块(con)**:`con`区域展示了如何将大块内容进一步细分为小块,如`one`、`two`、`three`和`four`,每个子块都有不同的背景颜色,通过`float:left`和`float:right`实现了并排显示。 5. **底部(footer)**...

    基于jQuery实现左右div自适应高度完全相同的代码

    在前端开发中,实现两个或多个元素高度相同是一种常见需求,尤其是对于并列排列的容器。在本案例中,需要使两个div元素的高度能够自适应,并保持一致。这里涉及到几个关键知识点:`clientHeight` 属性、`...

    js导出Word默认页面视图、横向显示、分栏

    3. **分栏**:分栏是Word中的一个高级排版功能,允许在单个页面上设置多个并列的文本区域。这在创建杂志、报纸或者报告时非常有用,可以有效地利用页面空间,使内容看起来更加规整和专业。 实现这些功能,我们通常...

Global site tag (gtag.js) - Google Analytics