`
msn877763580
  • 浏览: 84169 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

理解CSS的区块

    博客分类：
  • CSS
 
阅读更多

下面一段Html & Css代码

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link rel="stylesheet" type="text/css" href="style/basic.css" />
<title>理解区块</title>
<style type="text/css">
#condition{
	background:orange;
	border:1px solid black;
	padding:20px;
}
.box{
	border:1px solid black;
	margin:10px;/*外边距，上下左右空10px*/
	padding:10px/*内边距，上下左右空10px*/
}
#condition p{
color:blue;
}
.box p{
color:red;
}
</style>
</head>
<body>
	<div id="condition">
		<p>理解区块的测试</p>
		<div class="box">
		<p>子div1</p>
		</div>
		<div class="box">
		<p>子div2</p>
		</div>
	</div>
</body>
</html>

 

思考为什么子div2的颜色没有变成红色？



 

  • 大小: 40.5 KB
分享到：
| 学习spring的一点代码：对象注入的方式
评论
发表评论

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

相关推荐

    CSS区块网页模板

    "CSS区块网页模板"就是一种利用CSS技术预先设计好的网页布局框架，方便开发者快速构建具有特定样式和布局的网站。 在"CSS区块网页模板"中，我们通常会看到以下关键知识点： 1. **区块布局**：区块布局是网页设计中...

    理解CSS+DIV网页样式与布局

    在深入理解CSS+DIV网页样式与布局的过程中，首先需要把握CSS处理页面布局的基本原理。CSS（Cascading Style Sheets）是一种样式表语言，用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档的呈现。其核心在于...

    div+css手册

    盒模型的不同理解是CSS2.0和CSS3之间的一个重要区别，尤其是在浏览器兼容性方面。 4. **选择器增强**：CSS2.0增加了更复杂的选择器，如类选择器（`.class`）、ID选择器（`#id`）、后代选择器（`ancestor descendant...

    Div+Css模版

    7. **选择器与层叠规则**：理解CSS选择器如何工作，以及层叠规则如何决定哪些样式生效，是编写高效CSS代码的关键。 8. **CSS预处理器**：一些高级模板可能使用了Sass、Less等CSS预处理器，它们提供了变量、嵌套规则...

    CSS基础知识.pdf

    区块元素是网页布局的主要构成部分，本章将介绍如何通过CSS控制区块的宽度、高度、边框、内边距和外边距等，以实现复杂多样的布局设计。 在学习CSS的过程中，理解单位（相对单位如em、%和绝对单位如in、cm、px等）...

    css高清学习视频（从入门到精通）最佳的视频教程

    通过这套教程，你可以深入理解CSS（Cascading Style Sheets）的核心概念，掌握其在网页设计中的应用，从而实现从入门到精通的提升。 在描述中提到的“css高清晰学习视频 从入门到精通（续集）”，意味着这个系列...

    个人博客div+css可以作为作业交的

    2. 层叠原则：理解CSS的优先级，如何使用内联样式、内部样式表和外部样式表，以及！important的使用。 3. 响应式设计：利用媒体查询（@media rule）实现不同屏幕尺寸下的样式调整，确保博客在手机、平板和桌面电脑...

    精通CSS+Div源代码

    《精通CSS+Div源代码》是一本面向初学者的实用教程，旨在帮助...通过深入研究和实践光盘中的源代码，你将不仅能够理解CSS和Div的工作原理，还能培养出实际项目中的应用能力。这将是你步入Web前端开发领域的坚实一步。

    div+css 网站布局案例精粹 Sample

    div元素作为HTML中的一个区块容器，是构建网页布局的基础，而CSS（层叠样式表）则赋予了这些区块丰富的样式和定位能力，使得网页设计更具灵活性和可维护性。 1. **基础概念理解** - **Div元素**：HTML中的标签是一...

    DivCSS.rar_ divcss_divcss

    《深入理解DivCSS：构建网页布局的艺术》 在网页设计领域，HTML与CSS是不可或缺的基础技术，而DivCSS则是HTML布局的重要组成部分。本篇将基于提供的资料“DivCSS.rar”中的“DivCSS.pdf”，深入探讨DivCSS的核心...

    商业鞋店CSS网页模板

    【正文】 商业鞋店CSS网页模板是专门为鞋店或与鞋类相关的企业设计的一种网站界面样式，它结合了蓝色调的商务风格，旨在为在线商店提供...理解和掌握CSS、HTML以及响应式设计等知识，对于构建和优化这类模板至关重要。

    css简单实例源代码（模板）

    在CSS（层叠样式表）领域，理解和应用基础与实例是至关重要的。"CSS简单实例源代码（模板）"是一个适合初学者和开发者快速上手的资源，它提供了直观的CSS设计模式，帮助用户理解如何将CSS应用于HTML文档中，以实现...

    精通CSS+DIV样式和布局源码

    8. **盒模型**：理解CSS盒模型对于精确布局至关重要。盒模型包括元素的内容区域、内边距（padding）、边框（border）和外边距（margin），这些都会影响元素的总尺寸。 9. **CSS3新特性**：CSS3引入了许多新特性，如...

    [本人制作]纯css前台html框架样式公用插件-可配置网页数据区块布局内容动画等

    首先，我们要理解什么是CSS（Cascading Style Sheets）。CSS是一种样式表语言，用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档的呈现。它的主要作用是将结构与表现分离，使网页设计更为清晰，易于维护和...

    DIV+CSS页面布局

    理解CSS选择器是掌握CSS布局的关键。基本选择器包括元素选择器（如`div`）、类选择器（如`.class`）、ID选择器（如`#id`）以及后代、子元素和相邻兄弟选择器等，它们帮助我们精确地定位和操作HTML元素。 **四、盒...

    Div+CSS网页样式与布局从入门到精通 实例

    本教程"Div+CSS网页样式与布局从入门到精通"旨在帮助初学者掌握这一核心技术，通过实例深入理解其工作原理和应用技巧。下面将详细介绍Div和CSS的基础概念、它们在网页布局中的作用，以及如何从入门到精通。 Div...

    DIV+CSS网页布局商业案例精粹光盘源文件

    《DIV+CSS网页布局商业案例精粹光盘源文件》是一个集合了众多基于DIV和CSS技术的网页设计实例，旨在帮助读者深入理解并掌握这两种关键技术在实际商业项目中的应用。这个压缩包包含了丰富的源文件，提供了实践学习和...

    高级网站设计师手写代码篇（div+css布局）

    【标签】"div+css布局"强调了两个主要技术点：一是div元素，它是HTML中用于组织内容的区块；二是CSS布局，它负责定义div以及其他HTML元素的样式，如位置、尺寸、颜色、字体等，以此实现网页的美化和响应式设计。 在...

    300道HTML、CSS习题及面试题（含答案）

    1. 页面布局设计：在HTML中，页面布局设计通常是通过各种标签来实现的，比如常见的`div`用于布局分块，`header`用于头部区域，`footer`用于底部区域，`section`和`article`用于内容区块的划分等。 2. 标签语义化：...

    DIV+CSS黑色经典模板

    - **SEO友好**：结构清晰的`DIV+CSS`有利于搜索引擎理解网页内容，提高SEO排名。 - **加载速度**：相比传统的表格布局，`DIV+CSS`通常能减少代码量，提高页面加载速度。 5. **模板的构建** 构建一个`DIV+CSS`...

Magicbox
Global site tag (gtag.js) - Google Analytics