`
hehaibo
  • 浏览: 419754 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
社区版块
存档分类
最新评论

CSS基础知识

CSS 
阅读更多

CSS (Cascading Style Sheet) 层叠样式表,用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言.

样式分为:
1 行内样式
2 内嵌式
3 链接式
4 导入式

CSS基本语法:
1 css 选择器:
  a 标记选择器
   <style>
  h1   {color:red;    font-size:12px;}
选择器 {属性名:属性值;属性名:属性值;}
</style>
  b 类别选择器
   .class     {color: green;font-size:12px;}
   类别选择器 {属性名:属性值;属性名:属性值;}
  c id选择器
  #id    {color:yellow;font-size:12px;}
  id名称 {属性名:属性值;属性名:属性值;}

 
2 选择器的声明:
  a 集体声明:
<style>
  h1,h2,h3,h3,h4,h5,p{ //集体声明1
   color:red;
   font-size:15px; 
 }
 h2.special,.special,#one{//集体声明2
   text-decoration:underline;
 }
</style>

 code:
 <body>
  <h1>集体声明1</h1>
  <h2 class="special">集体声明2</h2> //同时应用集体声明1和集体声明2
  <h3>集体声明3</h3>
  <h4>集体声明4</h4>
  <h5>集体声明5</h5>
  <p>集体声明p1</p>
  <p class="special">集体声明p2</p3>
  <p id="one">集体声明p3</p> 
 </body>
  b:选择器的嵌套
   <style>
 p b{color:red;text-decoration:underline;}
   </style>
   code:
   <body>
     <p>嵌套使用<b>css</b>标记的方法<p>
     嵌套之外的<b>标记</b>不生效
   </body>

3 css 的继承
 a 父子关系
   <style>
     h1{color:red;text-decoration:underline;}
     h1 em{color:green;font-size:12px;}
   </style>
   code:
   <body>
     <h1>祖国的首都<em>北京</em>。</h1> //em斜体标记继承了h1标记
     //em 标记之间的内容首先会应用父类的样式,在应用的子类的样式
     //如果子类的样式和父类的相同,父类的将会被覆盖
   </body>
 

分享到：
| Linux 安装vsftp
评论
发表评论

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

相关推荐

    DIV+CSS教程——第一天XHTML_CSS基础知识

    DIV+CSS教程——第一天XHTML_CSS基础知识

    CSS基础知识学习笔记

    ### CSS基础知识学习笔记 #### 一、CSS简介与基本概念 **CSS**(Cascading Style Sheets)即层叠样式表，是一种用来表现HTML或XML等文件样式的计算机语言。CSS的作用在于控制网页的布局和样式，使网页内容的展现更加...

    CSS基础知识超全整理

    整理好的一份关于css的知识大纲，希望能够帮助到大家，可以用来复习回顾

    css基础知识word版

    【CSS基础知识】是Web开发中的重要组成部分，它用于控制网页元素的样式、布局和呈现方式。CSS（Cascading Style Sheets）允许开发者分离内容（HTML或XML）与表现（样式），使得网页设计更加灵活和可维护。 **1. CSS...

    CSS基础知识.pdf

    【CSS基础知识详解】 CSS，全称为Cascading Style Sheets，中文通常翻译为“层叠样式表”，是用于控制网页布局和样式的规范。它弥补了HTML在表现层设计上的局限性，让网页设计更加灵活多样。自IE 3.0开始，浏览器...

    XHTML CSS基础知识

    【XHTML CSS基础知识】是网页设计中的核心概念，它们构成了网页的基本结构和表现方式。XHTML，即Extensible Hypertext Markup Language，是HTML的一个增强版本，遵循XML的语法规则，更加严谨和标准。CSS，Cascading ...

    HTML+CSS基础知识点.pdf

    HTML+CSS 基础知识点总结 HTML+CSS 是前端开发的基础技术，掌握 HTML、CSS 和 JavaScript 语言是必不可少的。下面是 HTML+CSS 基础知识点总结： 1. HTML 是网页内容的载体，内容就是网页制作者放在页面上想要让...

    CSS基础知识-1.pdf

    ### CSS基础知识解析 #### 一、CSS简介 - **1.1 HTML的局限性** HTML是一种用于构建网页内容的标准标记语言。它主要用于定义网页内容的结构和意义，例如使用`&lt;h1&gt;`标签来表示一级标题，使用`&lt;p&gt;`标签来表示段落...

    html&css入门基础知识点.pdf

    HTML和CSS基础知识点 HTML是用来描述网页的一种语言，指的是超文本标记语言（Hyper Text Markup Language），它不是一种编程语言，而是一种标记语言。HTML使用标记标签来描述网页的结构和内容。 标记语言是一套...

    css基础知识 code

    这个“css基础知识 code”主题涵盖了CSS的基本概念、语法和常见应用，旨在帮助初学者理解并掌握CSS的核心知识。下面我们将深入探讨这些知识点。 首先，CSS是用来分离HTML或XML（包括如SVG、MathML等各种XML方言）...

    css基础知识

    ### CSS基础知识概述 CSS（Cascading Style Sheets）即层叠样式表，是一种用来表现HTML或XML等文件样式的计算机语言。它不仅能够使网页的布局更加美观、规范，还能提高网页的加载速度，增强用户体验。本文档将从...

    Dreamweaver8系列DIV+CSS教程XHTML_CSS基础知识.zip

    《Dreamweaver8系列DIV+CSS教程XHTML_CSS基础知识》是一个综合性的教学资源，主要针对网页设计初学者，旨在帮助他们掌握XHTML和CSS的基础知识，以及如何在Adobe Dreamweaver 8环境下进行实践操作。这个教程涵盖了...

    第2章 CSS基础知识

    第2章 CSS基础知识,讲解CSS的盒子模型，CSS的浮动与定位,利用CSS布局网页等等。

    CSS基础知识汇总（代码+知识点框图）

    **CSS基础知识概述** CSS，全称Cascading Style Sheets，是一种用于定义网页中元素样式和布局的语言。它允许我们将设计和结构分离，使网页的样式更易于管理和维护。本资料集合了CSS的基础知识，包括代码示例和用...

    DIV+CSS基础知识

    **DIV+CSS基础知识详解** 在网页设计领域，`DIV+CSS`是一种常用的技术组合，用于实现页面布局和样式控制。`DIV`（Division）是HTML中的一个区块元素，主要用于组织和划分网页内容；而`CSS`（Cascading Style Sheets...

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