后面就将要介绍css的全面语法:

1.css介绍

2.css基本语法

3.css高级语法

4.css派生选择器

5.css的id选择器

6.css类选择器

7.css属性选择器

!!!!!css介绍

css是层叠样式表,极大地提高了效率

!!!!!!css的基本语法

selector{

property:value

}

1.属性大于一个后,要用分号分开 eg:h1{color:red;font-size:14px}

2. 如果属性值大于一个单词,要用“”包围。eg:p{font_family:”sans serif”}

!!!!!css高级语法

1.选择器分组:h1,h2,h3,h4,h5,h6{color:red}

2.继承:body{color:green} ,如果在body定义了样式,body里面的元素如果没有声明样式,会继承body的属性

!!!!代码实例 ,index代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Html5样式</title>
    <link href="MyCss.css" type="text/css" rel="stylesheet">
</head>
<body>
    <h1>这是一个样式</h1>
    <a href="http://www.baidu.com">百度一下</a>
    <h2>这是标题2样式</h2>
    <h3>这是H3样式</h3>
</body>
</html>

css代码

h1,h2,a{
    color: blue;
}

!!!@!效果图

继承实例,index代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Html5样式</title>
    <link href="MyCss.css" type="text/css" rel="stylesheet">
</head>
<body>
    <h1>这是一个样式</h1>
    <a href="http://www.baidu.com">百度一下</a>
    <h2>这是标题2样式</h2>
    <h3>这是H3样式</h3>
    <p>这是一个段落</p>
</body>
</html>

css代码

h1,h2,a{
    color: blue;
}
body{
    color:red;
}
p{
    color:chartreuse;
}

!!!效果图

css3学习之旅-css的基本语法(1)的更多相关文章

  1. CSS3学习笔记(2)-CSS盒子模型

    p{ font-size: 15px; text-indent: 2em; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid ...

  2. 【css学习整理】css基础(样式,语法,选择器)

    CSS是什么? cascading 层叠样式表 sheet 样式文件 style 外观个性化 CSS语法? 声明方法: 选择器(属性: 值; 属性: 值) 选择器: 通过名称制定对哪些标签进行样式设置 ...

  3. web开发学习之旅---css第一天

    一.css全称 Cascade Style Sheet层叠样式表 二.css引入方式 行内样式:<h2 style="color:#0F0">Hello World&l ...

  4. Css的学习之旅-css的选择器(2)

    1.最常用的是派生选择器:eg:ul li{ color:red} 2.id选择器:eg:#id{color:red} 3.类选择器:设置标签的class = "",类似id.用点 ...

  5. CSS3学习笔记(3)-CSS3边框

    p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...

  6. css和css3学习

    css和css3学习 css布局理解 css颜色大全 样式的层叠和继承 css ::before和::after伪元素的用法 中文字体font-family常用列表 cursor属性 css选择器 F ...

  7. 【学】React的学习之旅1

    React的学习之旅1 单标签要有斜杠代表结束 用React.createClass()方法时,赋值后的组件名称首字母一定要大写 一定要先定义组件,再用ReactDOM.render调用 组件里ren ...

  8. Java web 学习之旅

    java web学习之旅 来公司十天了,感觉已经慢慢地融入了这个环境中,几个学长人都很好,都是在他们帮助下,我才能比较顺利的开始了学习java web的旅途. 来这里学习的第一个阶段是做一个简单的用户 ...

  9. WCF学习之旅—实现支持REST客户端应用(二十四)

    WCF学习之旅—实现REST服务(二十二) WCF学习之旅—实现支持REST服务端应用(二十三) 在上二篇文章中简单介绍了一下RestFul与WCF支持RestFul所提供的方法,及创建一个支持RES ...

随机推荐

  1. ctf writeup之程序员密码

    起因 在v2ex上看到有人发了一篇帖子,说做了一个程序员小游戏,遂试玩了一下. 游戏的地址在这里: http://www.bettertomissthantomeet.com/pages/level. ...

  2. 【博弈】【HDU】取石子游戏

    取石子游戏 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  3. Node.js 流

    稳定性: 2 - 不稳定 流是一个抽象接口,在 Node 里被不同的对象实现.例如request to an HTTPserver 是流,stdout 是流.流是可读,可写,或者可读写.所有的流是 E ...

  4. jQuery 遍历 – 后代

    后代是子.孙.曾孙等等. 通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代. 向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() f ...

  5. 给大家安利一个学习angular2的视频网站

    本文地址:http://blog.csdn.net/sushengmiyan 本文作者:苏生米沿 视频地址: https://egghead.io/courses/angular-2-fundamen ...

  6. linux系统性能监控--CPU利用率

    在对系统的方法化分析中,首要且最基本的工具之一常常是对系统的 CPU利用率进行简单测量. Linux以及大多数基于 UNIX的操作系统都提供了一条命令来显示系统的平均负荷(loadaverage) . ...

  7. Linux命令行总结

    1.修改同一目录下所有图片的尺寸(宽x高) 长宽比不变&长宽比改变 find ./ -name '*.jpg' -exec convert -resize 600x480 {} {} \; f ...

  8. Scala:函数式编程之下划线underscore

    http://blog.csdn.net/pipisorry/article/details/52913548 python参考[python函数式编程:apply, map, lambda和偏函数] ...

  9. Scikit-learn:数据预处理Preprocessing data

    http://blog.csdn.net/pipisorry/article/details/52247679 本blog内容有标准化.数据最大最小缩放处理.正则化.特征二值化和数据缺失值处理. 基础 ...

  10. iOS开发之Xcode常用调试(Debug)技巧总结

    一.Xcode调试技巧之:NSLog 上面也提到了,在我们日常的开发过程中最常见的Debug方式就是打Log.而在OC语言中,打Log是采用NSLog方法.但是NSLog效率低下,具体原因可以看这篇博 ...