`
leshor
  • 浏览: 18713 次
  • 性别: Icon_minigender_1
  • 来自: 广州
最近访客 更多访客>>
社区版块
存档分类
最新评论

CSS学习(二)

 
阅读更多
    CSS语法:
       
引用
selector {declaration1; declaration2;declarationN}
,其中declaration格式为
引用
property:value
,所以完整语法为:
引用
selector {property1:value1; property2:value2;}
.举例:p {color:red; font-size:10px},将p元素内的文字颜色定义为红色,同时将字体大小设置为 14 像素。
       说明:
             p----selector,选择器,通常是您需要改变样式的 HTML 元素。
             {color:red; font-size:10px}----declaration,声明。
             color----property,属性,您希望设置的样式属性(style attribute)。
             red----value,属性值,样式属性的值

         value,有时候有多种写法,当然也有多种单位。如果value为多个单词时,需要用双引号括起来。

          多个decalration之间,用分号隔开,最好一个declaration占一行,利于read。最后一个declaration最好也加上分号,有利于以后增删

         CSS不区分大小写,空格和空行也不影响显示效果。

     选择器(selector):
         可以对选择器进行分组,这样,被分组的选择器就可以分享相同的声明。
          
引用
h1,h2,h3 {color:pink;}

         根据CSS,子元素从父元素继承属性。但是由于浏览器的世界大战,不保证一定能成功继承,最好是father和son分开定义。当son定义了和father一样的属性时,son自动覆盖father的属性。
        派生选择器:派生选择器允许你根据文档的上下文关系来确定某个标签的样式。通过合理地使用派生选择器,我们可以使 HTML 代码变得更加整洁。
           定义li标签里strong元素的样式。
        
引用
li strong {
                  font-size:10px;
                  font-style:italic;
               }

        id 选择器:为标有特定id的HTML元素指定特定的样式,id选择器以#开头。
            
引用
#red {color:red;}

          
引用
<p id="red">红色文字</p>

         id 属性只能在每个 HTML 文档中出现一次.
         id选择器可以与派生选择器结合使用,一个id元素可以结合多个其他元素。例如,指定id为tree的元素的段落(p)的字体颜色为红色。
             
引用
#tree p {color:red;}

           
引用
#tree h1 {color:pink;}

  • 大小: 3.5 KB
分享到:
评论

相关推荐

    css样式工具 css学习工具

    本篇文章将围绕“CSS样式工具”和“CSS学习工具”这两个核心概念,详细介绍相关知识点。 一、CSS基础知识 1. 选择器:CSS选择器是用于选取HTML元素的方式,例如标签选择器(如`p`)、类选择器(如`.myClass`)和ID...

    CSS学习手册,CSS学习

    **CSS学习手册** 在网页设计领域,CSS(Cascading Style Sheets)是不可或缺的一部分,它负责定义网页元素的样式,包括颜色、字体、布局以及页面的呈现方式。本手册将帮助初学者深入理解和掌握CSS的基本概念和技术...

    CSS学习经典教程

    【CSS学习经典教程】是一份专为初学者和有一定基础的学习者设计的教程,旨在帮助他们深入理解并熟练掌握CSS(层叠样式表)技术。CSS是网页设计中不可或缺的一部分,用于控制网页元素的布局、颜色、字体、大小等视觉...

    css学习手册

    《CSS学习手册》 在网页设计领域,CSS(Cascading Style Sheets)是不可或缺的一部分,它赋予了HTML或XML文档以样式和布局。本手册旨在深入解析CSS的相关知识,帮助初学者快速上手并掌握其核心概念。 一、CSS基础 ...

    css学习心得内容包括了所有css样式调整

    在这个"css学习心得"中,我们将详细探讨CSS的各个方面,帮助开发者更好地理解和应用这一技术。 首先,CSS的基础知识是必不可少的。这包括选择器,如类选择器(.class)、ID选择器(#id)和元素选择器(element),...

    电脑css学习教程电脑css学习教程

    电脑CSS学习教程是针对想要深入理解和掌握CSS技术的初学者或进阶者设计的一系列学习资料。 在CSS的学习过程中,你需要了解以下几个核心概念: 1. **选择器(Selectors)**:选择器用于定位HTML或XML文档中的特定...

    CSS学习帮助文档(chm格式)

    这个“CSS学习帮助文档(chm格式)”显然是一个专门针对CSS技术的综合资源,包含了关于样式设计的各种信息,旨在帮助用户深入理解和掌握CSS。 **CSS基础** CSS的基础概念包括选择器、属性和值。选择器用于匹配HTML...

    CSS学习资料,初级

    本资源包“CSS学习资料,初级”专为初学者设计,旨在提供一个易于理解的学习平台,帮助初学者快速掌握CSS的基础知识。 **一、CSS简介** CSS(Cascading Style Sheets)是一种样式表语言,用于描述HTML或XML(包括如...

    css学习大全(包括css生成器,各种经典样式,css学习文档)

    这个压缩包文件看起来是一个全面的CSS学习资源集合,包含了CSS生成器、各种经典的CSS样式示例以及CSS的学习文档。接下来,我们将深入探讨这些知识点。 首先,CSS生成器是一个在线工具,它允许用户通过图形用户界面...

    CSS学习 CSS+XHTML

    在"CSS学习"这个主题中,我们需要探讨以下几个关键知识点: 1. **CSS基础**:CSS的基本语法包括选择器、属性和值。选择器用于指定要应用样式的元素,比如`p`代表所有段落,`.class`代表具有特定类名的元素,`#id`...

    DIV+CSS学习文档

    【DIV+CSS学习文档】 网页设计与开发领域中,`DIV+CSS`是一种常见的布局技术,它极大地提升了网页的可维护性和效率。本学习文档旨在深入解析`DIV+CSS`的核心概念,帮助初学者理解并掌握这一技术。 一、什么是DIV?...

    css经典学习笔记.zip

    综上所述,《CSS经典学习笔记》旨在提供一个全面的CSS学习路径,无论你是初学者还是有经验的开发者,都能从中受益,提升你的CSS技能和网页设计能力。通过深入实践和不断探索,你会发现CSS不仅可以打造出美观的界面,...

    一个css学习打包网站

    这个名为“一个css学习打包网站”的资源,显然是为了帮助学习者深入理解和掌握这一技术。 首先,CSS是用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档样式的语言。它的主要功能是分离网页内容和表现,...

    css学习比较不错的资料

    这篇详尽的指南将针对标题"css学习比较不错的资料"和描述中的内容,提供关于CSS的基础知识,旨在让初级水平的学习者也能轻松理解和掌握。 首先,CSS是Web设计的核心技术之一,它负责定义网页的外观、布局和结构。...

    学习CSS必备 5日精通CSS EXE电子书.rar

    - Grid布局:学习CSS网格系统,用于创建二维布局。 5. CSS响应式设计: - 媒体查询:利用@media规则针对不同设备和屏幕尺寸设置不同的样式。 - 移动优先和流式布局:理解如何构建适应各种屏幕大小的网站。 6. ...

    DIV+css学习 精通CSS实例

    本教程“DIV+CSS学习 精通CSS实例”旨在帮助初学者掌握这一关键技术,通过20个精心设计的实例,深入浅出地讲解了CSS的布局原理和实际应用。 首先,我们要理解什么是CSS。CSS(Cascading Style Sheets)层叠样式表,...

    CSS学习手册

    **CSS学习手册** 在网页设计领域,层叠样式表(Cascading Style Sheets,简称CSS)是不可或缺的一部分,它赋予HTML或XML文档以视觉样式,让网页内容更加丰富多彩且易于维护。作为史上最全的CSS学习手册,我们将深入...

    CSS二十个学习推荐外文网站

    以下是对“CSS二十个学习推荐外文网站”的详细解析: 1. **MDN Web Docs** (https://developer.mozilla.org/zh-CN/css):Mozilla 开发者网络提供全面的 CSS 参考指南,包括语法、属性和实例,是学习和查找 CSS 信息...

    精通CSS第二版、CSS那些事、CSS权威指南 第3版

    这三本书合在一起,构成了一个全面的CSS学习路径。从基础到高级,从理论到实践,从解决常见问题到探索前沿技术,它们都能提供丰富的知识和洞察。无论你是刚开始接触CSS,还是想要提升现有技能,这些资源都将极大地...

Global site tag (gtag.js) - Google Analytics