CSS(一):CSS简介和基本语法
一、CSS简介
1、什么是CSS
CSS:Cascading Style Sheet:即层叠样式表。样式定义了如何显示HTML或XHTML元素。包括对字体、颜色、边距、高度、宽度、背景图片、网页定位等设定。
2、CSS的作用
能控制页面的样式和布局。
网页文件和样式文件相分离,可以提高开发效率。
3、CSS的发展史
1996年CSS1.0推出
1998年5月CSS2.0推出
2004年CSS2.1推出
2010年CSS3.0推出
二、CSS语法
1、style标签
例如:
<html>
<head>
<style type="text/css">
h1{
font-size:12px;
color:#F00;
}
</style>
</head>
</html>
注意:
1、<style>标签应写在<head>标签之间。
2、style元素始终要以<style type="text/css">开头,最后以一个结束</style>标记结尾。
2、基本语法
CSS规则由两个主要的部分构成:选择器,以及一条或多条声明。
selector {declaration1; declaration2; ... declarationN }
选择器通常是您需要改变样式的HTML元素。
每条声明由一个属性和一个值组成。
属性是希望设置的样式属性。每个属性有一个值。属性和值使用冒号分开。
selector {property: value}
示例:将h1标签内的文字颜色定义为红色,字体大小设置为14像素
h1 {color:red; font-size:14px;}
下面的示意图展示了上面代码的结构:

注意:
1、CSS对大小写不敏感。如果涉及到与HTML文档一起工作的话,class和id名称对大小写是敏感的。
2、声明要使用花括号括起来。
3、CSS的最后一条声明后的“;”可写可不写,建议都要写上。这样写的好处是:当你从现有的规则中增减声明时,会尽可能地减少出错的可能性。例如:
p {text-align:center; color:red;}
4、CSS如果要定义不止一条声明,则需要用分号将每条声明分开。多条声明可写在同一行,但开发时为了便于阅读建议分行写并缩进。例如:
p {
text-align: center;
color: black;
font-family: arial;
}
5、如果属性值由若干单词组成,则要给属性值加引号,例如:
p {font-family: "sans serif";}
CSS(一):CSS简介和基本语法的更多相关文章
- css系列教程--简介及基础语法和注意事项
css简介:css指的是层叠样式表,cascading style sheets.用来定义html中的dom节点如何展示在页面中的问题.解决了内容与表现形式的分离问题.常见的样式表有外部链接样式表和内 ...
- HTML 学习笔记 CSS样式(简介和语法)
CSS概述 CSS指层叠样式表(Cascading Style Sheets) 样式定义如何显示HTML元素 样式通常存储在样式表中 把样式添加到HTML4.0中 是为了解决内容与表现分离的问题 外部 ...
- [JavaWeb基础] 028.CSS简介和基础语法
css 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...
- 常用CSS优化总结——网络性能与语法性能建议
在前端面试中最常见的问题就是页面优化和缓存(貌似也是页面优化),被问了几次后心虚的不行,平然平时多少会用到一些,但突然问我,很难把自己知道的都说出来.页面优化明显不是一两句能够说完的,这两天总结了一下 ...
- (转)常用CSS优化总结——网络性能与语法性能建议
原文地址:http://www.cnblogs.com/dolphinX/p/3508657.html 在前端面试中最常见的问题就是页面优化和缓存(貌似也是页面优化),被问了几次后心虚的不行,平然平时 ...
- CSS(1)---css语法、css选择器
CSS(1)---css语法.css选择器 一.CSS语法 1.CSS语法 CSS 规则由两个主要的部分构成:选择器以及一条或多条声明. 属性 是您希望设置的 样式属性.每个属性有一个属性值.属性和属 ...
- HTML&CSS基础-CSS的语法
HTML&CSS基础-CSS的语法 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.dome.html源代码 <!DOCTYPE html> <html ...
- CSS:CSS 语法
ylbtech-CSS:CSS 语法 1.返回顶部 1. CSS 语法 实例 查看 实例 1 查看 实例 2 CSS 实例 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明: 选择器通常是 ...
- Day 30:HTML和CSS在Java项目中常用语法
framSet例子,其中的页面链接地址视情况而定,应为我还不知怎么弄当前文件下呢,例子主要在说明该标签如何使用 <!DOCTYPE html PUBLIC "-//W3C//DTD X ...
- HTML+CSS笔记 CSS笔记集合
HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...
随机推荐
- 重写lucene.net的分词器支持3.0.3.0版本
lucene.net中每个分词器都是一个类,同时有一个辅助类,这个辅助类完成分词的大部分逻辑.分词类以Analyzer结尾,辅助类通常以Tokenizer结尾.分类词全部继承自Analyzer类,辅助 ...
- iOS开发 - 用AFNetworking实现https单向验证,双向验证
https相关 自苹果宣布2017年1月1日开始强制使用https以来,htpps慢慢成为大家讨论的对象之一,不是说此前https没有出现,只是这一决策让得开发者始料未及,博主在15年的时候就做过ht ...
- spring 4.0下集成webservice
该教程使用的项目可参见: Intellij Idea下搭建基于Spring+SpringMvc+MyBatis的WebApi接口架构 具体源码请参见GitHub: https://github.com ...
- Symantec Backup Exec(BE)的启停
# /etc/init.d/VRTSralus.init start Starting Symantec Backup Exec Remote Agent ...... Starting Symant ...
- 软件测试自动化之- API Test
API测试 从本质上来说,API测试是用来验证组成软件的那些单个方法的正确性,而不是测试整个系统本身. API测试也被称为单元测试(Unit Testing), 模块测试(Module Testing ...
- rubygems ruby国内源
rubygems.org资源不能正常访问,需要调整一下GEM的source镜像 1.首先确认一下当前source镜像地址 gem sources -l 服务器为 https:// ruby ...
- 依据经纬度返回地址的url -- GoogleMap
latlng=34,112">https://maps.googleapis.com/maps/api/geocode/xml? latlng=34,112
- vim编写Bash脚本
vim编写Bash脚本,可以说是类unix系统下的原生应用啊,想到初vi编辑器可是每个unix自带的哦. 缩进:在.vimrc中添加 filetype plugin indent on 未完待续,以后 ...
- [svc]kill pkill killall管理进程
进程讲解 操作配置 http://www.centoscn.com/CentOS/help/2013/0809/1218.html 终止一个进程或终止一个正在运行的程序,一般是通过 kill .kil ...
- [na]mail收发过程
以前老记不住这smtp和pop3谁收谁发. 简单邮件传输协议(SMTP),用来发送或中转发出的电子邮件, 占用tcp 25端口. 第三版邮局协议(POP3),用于将服务器上把邮件存储到本地 ...