码迷,mamicode.com
首页 > Web开发 > 详细

css基本语法简单介绍

时间:2016-01-26 21:53:43      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:

css基本语法简单介绍:
本章节介绍一下css的基本语法,比较适合于初学者阅读,对于稍有经验的人员来说,几乎没有太多帮助,可以略过。
使用css的方式主要以下三种:

1.行内样式
2.内嵌样式
3.外联样式

当然可能不同的教材中的名称有所不同,不过实质都是一样的,不必太过纠结。
下面分别介绍一下上面三种方式的使用。
一.行内样式:
所谓的行内样式就是通过标签的style属性,将css代码写在标签之内,代码如下:

<div style="color:blue">softwhy.com</div>

优点是使用简单,缺点也是非常的明显,违背了表现与内容分离的原则,所以不推荐使用。
二.内嵌样式:
内嵌样式就是讲css代码写到<style>标签之中,代码如下:

<style type="text/css">
div{
  font-size:12px;
  color:green;
}
</style>

通常情况下<style>标签要放在头部,当然也可以放在其他的地方。此中方式的应用的有点也是非常的简单方便,但是如果css代码较多的话,就会使页面非常的庞大。
三.外联样式:
外联样式,就是将一个css文件引入当前页面,代码如下:

<link rel="stylesheet" type="text/css" href="style.css" />

当css代码较多的时候,推荐使用此方式。
四.常用选择器:
当然常用的选择器有很多中,因为本章节是针对的初学者,所以介绍一下最为基础和常用的选择器。

1.HTML标签选择器
2.群组选择器
3.包含选择器
4.Class选择器
5.ID选择器

这里就不一一介绍了,可以参阅相关文章即可。
相关阅读:
1.标签选择器可以参阅CSS的类型选择符(E)一章节。
2.群组选择器选择器可以参阅CSS的选择器分组一章节。
3.包含选择器选择器可以参阅CSS的包含选择符(E F)一章节。
4.class选择器可以参阅CSS的class选择符一章节。
5.id选择器可以参阅CSS的id选择器一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=15647

更多内容可以参阅:http://www.softwhy.com/divcss/

css基本语法简单介绍

标签:

原文地址:http://www.cnblogs.com/xiaofinder/p/5161556.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!