`
FZtree
  • 浏览: 111851 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

css div控制

 
阅读更多
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>

<div id="container" style="width:500px">

  <div id="header" style="margin:0 auto;width:200px;">
    <div id="left" 
      style="background-color:#FFA500;text-align:center;
            width:100px;float:left;">left</div>
    <div id="right" 
      style="background-color:#FFD700;text-align:center;
            width:100px;float:left;">right</div>
    <div id="capa" style="clear:both;"></div>
  </div>

  <div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
    <b>Menu</b><br>
    HTML<br>
    CSS<br>
    JavaScript
  </div>

  <div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
    Content goes here
  </div>

  <div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
    Copyright © W3Schools.com
  </div>

</div>

</body>
</html>

 

ref http://www.w3cschool.cc/html/html-layouts.html

 

DIV块级元素,同级别DIV默认起下一行。

同级别DIV如果需要并排,设置float:left。最后还要记得在加一个同级div,设置clear:both,这样,后面的同级div就又是默认起下一行了。

 

div设置自己居中,设置magin:0 auto

 

div设置自己内部的文字居中,设置text-align:center

 

分享到:
评论

相关推荐

    css+div控制表格 标签代码

    标题“css+div控制表格 标签代码”表明我们将探讨如何利用CSS来改变和优化HTML表格的样式,使其符合网页设计的一般需求。 表格在网页中常用于展示结构化数据,其基本HTML标签包括`&lt;table&gt;`、`&lt;tr&gt;`(行)、`&lt;th&gt;`...

    DIV+CSS DIV居中布局

    本篇文章将深入探讨如何利用`DIV+CSS`实现`DIV`的居中布局。 首先,我们要理解`&lt;div&gt;`元素。`&lt;div&gt;`是“division”的缩写,代表一个区域或区块,在HTML中用于组合其他元素,是构建网页布局的基础。通过设置`&lt;div&gt;`...

    css模板 css div模板

    CSS `div`模板是一组预先定义的CSS类,专门用于控制`div`元素的样式,如宽度、高度、边距、背景色、边框等。这些模板可以方便地应用于不同的页面区域,如页头、主体内容、侧边栏和页脚,帮助构建复杂的多列布局。 *...

    cssdiv

    在网页设计领域,CSS(Cascading Style Sheets)与DIV元素是构建现代网页布局的核心技术。"精通CSS+DIV网页样式与布局"是一门旨在帮助学习者深入理解这两项技术的课程或书籍,由作者曾顺编著。在这个主题中,我们将...

    DIV+CSS.rar_DIV_aspnet div css _css_css div_css div asp p

    通过学习,用户将了解如何利用&lt;div&gt;元素进行网页区域划分,如何用CSS控制样式,包括定位、尺寸、颜色、字体等,以及如何在ASP.NET环境中整合这些技术。此外,可能还会接触到更复杂的话题,如响应式设计、浮动布局、...

    css + div 滑动弹出div效果

    这里,`slideToggle()`方法会根据参数("slow"表示慢速)控制滑动速度,使得div以滑动的方式显示或隐藏。 至于压缩包文件"jDiv"可能包含了实现上述效果的示例代码,包括HTML结构、CSS样式和JavaScript脚本。解压后...

    div+css div+css精通CSS

    标题与描述中提到的“div+css div+css精通CSS”这一主题,主要涉及的是网页设计与布局的核心技术——利用HTML中的div元素结合CSS样式表进行网页内容的组织与美化。接下来,我们将深入探讨这一主题所包含的关键知识点...

    div+css手册

    《div+css手册》是一本深入探讨网页布局技术的重要参考资料,尤其对于网页设计者和前端开发者来说,它具有极高的学习价值。这个手册的核心聚焦在HTML中的`div`元素和CSS(层叠样式表)的结合使用上,旨在帮助读者...

    css+div网页模板整站

    Div可以用来组织文档结构,通过CSS样式控制,可以创建出各种复杂的网页布局。在本资料中,每个页面可能都由多个Div元素构成,这些元素通过嵌套和并列,形成页面的层次结构,从而实现动态和静态内容的排列。 在文件...

    cssdiv网页样式与布局

    CSS用于控制网页的外观和格式,而DIV则是一种HTML(HyperText Markup Language)元素,用于组织页面内容并实现布局。这两者的结合使得网页设计师能够创建出美观、响应式且易于维护的页面。 首先,我们要理解CSS的...

    CSS.DIV实列

    2. **定位**:CSS提供了静态、相对、绝对和固定定位,可以精确控制`div`在页面中的位置。例如: ```css .absolute-div { position: absolute; top: 50px; left: 100px; } ``` 3. **响应式设计**:利用媒体...

    纯CSS3实现DIV高亮显示特效

    "纯CSS3实现DIV高亮显示特效"是一种技术,它利用CSS3的特性,无需依赖JavaScript或图像,就能创建出吸引人的高亮效果。这篇文章将深入探讨如何使用CSS3来实现这一效果。 首先,我们要了解CSS3的一些基本概念。CSS3...

    精通CSS与DIV资源管理及素材

    在IT行业中,CSS(Cascading Style Sheets)和DIV是构建网页布局和设计的重要工具。它们共同作用,使网页呈现出美观、响应式的视觉效果。在这个名为“精通CSS与DIV资源管理及素材”的压缩包中,你将找到一系列关于这...

    DIV_CSS.rar_CSS+DCV_DIV_CSS_asp css d_css div做word_div css工具

    `div`元素是HTML中最常用的内容容器,通过CSS可以对`div`进行定位、尺寸设置、背景颜色、边距、边框等样式控制,实现复杂的页面布局。 2. **DCV(假设为CSS Document and View)**:这可能是一个概念,强调了CSS在...

    div+css布局大全

    下面,我们将深入探讨div+css布局的相关知识点。 1. **Div元素**:HTML中的`&lt;div&gt;`(division)元素是一个通用容器,用于组合HTML元素,为页面提供结构。通过设置`&lt;div&gt;`的类或ID属性,我们可以对多个元素进行分组...

    网站模板 web css div js

    通过CSS,我们可以控制字体、颜色、间距、布局和响应式设计等。在"styles"目录中,可能包含一个或多个CSS文件,如style.css,用于定义各页面的样式规则。CSS可以使用类选择器、ID选择器、元素选择器等方式来针对性地...

    Div+CSS层完美实现拖拽特效

    在网页设计中,Div+CSS布局是现代网页开发的基础,它允许我们通过CSS来控制页面元素的样式,而Div作为HTML中的一个块级元素,常用于构建页面结构。本篇文章将详细探讨如何利用Div+CSS技术实现完美的层拖拽特效,这种...

    十步学会用css+div建站

    2. **CSS介绍**:CSS是用于控制网页外观和样式的语言。学习CSS选择器,如标签选择器、类选择器、ID选择器,以及更复杂的子选择器和相邻兄弟选择器等,用于精确地定位和风格化HTML元素。 3. **盒模型**:理解CSS盒...

    css,div+css

    【CSS和Div+CSS布局详解】 CSS(Cascading Style Sheets)是一种用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档样式的样式表语言。在网页设计中,`div+css`布局是一种常见的网页布局方式,它将结构...

    css控制div的宽度

    在网页设计中,CSS(Cascading ...总结起来,CSS控制div的宽度是网页布局中的基础操作,通过不同的属性和技巧,我们可以实现各种灵活的布局和动态效果。结合JavaScript和jQuery,我们可以创建更丰富的用户交互体验。

Global site tag (gtag.js) - Google Analytics