CSS3(Cascading Style Sheet) 层叠样式表

CSS是Cascading Style Sheet 层叠样式表或级联样式表，简称“样式表”。利用样式可以定义页面的样式，大大减少网页的设计工作量。也可以美化页面，精准定制页面的布局。
CSS3样式的优势：
       1.丰富的修饰样式
       2.内容与修饰分离，利于项目开发
       3.实现样式复用，提高开发效率
       4.实现页面的精确控制。

一、CSS基础

一个样式的基本语法由选择器、属性、属性值3部分组成层叠样式表通常用<style></style>来声明样式规则，即告诉浏览器如何正确的页面中的各类元素
语法：

<style type="text/css">选择器{属性1:属性值1;属性2:属性值2;......}
</style>

示例：

<style type="text/css">p{font-size: 100px;}
</style>

CSS样式的代码有以下规范：
       1.虽然css代码不区分大小写，但推荐全用小写。
       2.每条样式规则用分号“;”隔开，通常写为多行，简单的规则也可以合并为一行。
       3.当css代码较多时，可以使用“/*....*/”添加必要的注释，增加代码的可读性。

CSS样式根据书写位置不同，可以分为：外部样式、内嵌样式、行内样式3种:
1.外部样式
1.1 链接外部样式：
通过HTML的link标签，建立样式文件和网页的关联。样式文件的后缀名为 .css

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

1.2 导入样式表：
在网页中可以通过@import的方式导入样式表

<head><style type="text/css">@import "css/style.css";</style>
</head>

2.内嵌样式：
将样式表的内容直接放置于HTML5的<head></head>的区域内，通过<style></style>标签定义。在实际开发中建议使用外链样式。

语法：

<head><style type="text/css">选择器{属性1:属性值1;属性2:属性值2;......}</style>
</head>

示例：

<!--内嵌样式-->
<style type="text/css">p{font-size: 100px;}
</style>

3.行内样式：
是混合在HTML5标签中定义的，用这种方法可以直接对某个元素定义样式。行内样式在直接在H5的标签中加入style属性，其内容式CSS3的属性和属性值。
语法：
<标签名 style="样式属性:属性值;"></标签名>

示例：

 <p style="color: red;">天凉好个秋！</p>

CSS3(Cascading Style Sheet) 层叠样式表相关推荐

什么是CSS，有什么作用？\nCSS(Cascading Style Sheet)：层叠样式表语言。\nCSS的作用是：\n修饰HTM
什么是CSS,有什么作用?\nCSS(Cascading Style Sheet):层叠样式表语言.\nCSS的作用是:\n修饰HTML页面,修饰HTML页面张的某些元素的样式,让HTML页面更好看. ...
css sheet2.0,详解CSS3.0(Cascading Style Sheet) 层叠级联样式表
CSS3.0(Cascading Style Sheet) 层叠级联样式表快速入门: CSS01 h1 { color: red; } 标题一 CSS的三种导入方式: 行内样式(优先级最高,但不建议 ...
CSS（Cascading Style Sheet）
文章目录 CSS(Cascading Style Sheet) 使用方式基本语法颜色写法选择器*** 标签选择器 id选择器类选择器选择器分组层次选择器伪类 pseudo-classes ...
CSS(Cascading Style Sheet)总结
CSS 层叠样式表 (Cascading Style Sheet) 1.字体设置: 有继承性,给父元素设置,子元素可继承. (1)字体倾斜:font-style:normal/italic (2)字体 ...
CSS cascading style sheet
html+css+javascript 结构+表现+交互 css怎么用(快速入门) css选择器(重点,难点) 美化网页(文字,阴影,超链接,列表,渐变) 盒子模型浮动定位网页动画(特效)非重点 ...
CSS(层叠样式表cascading style sheet)——CSS样式、基础选择器
一.CSS作用对页面的外观进行美化统一网站页面的风格实现内容和样式的分离,适合团队开发二.CSS语法规范三.CSS引入方式 CSS的3种样式表书写位置的不同分为:行内样式表(行内式) ...
CSS(Cascading Style Sheets) 层叠样式表
CSS通常称为CSS样式表或层叠样式表(级联样式表),主要用于设置HTML页面中的文本内容(字体.大小.对齐方式等).图片的外形(宽高.边框样式.边距等)以及版面的布局等外观显示样式. CSS以HTM ...
cascading style sheet第一课
css引入方式: 1.内嵌式,写到<head>里面,<style>.(小案例适用) 2.外联式:写在单独的css文件中,通过link标签引入.(head里写<link r ...
Cascading Style Sheet 层叠级联样式表
CSS发展史 CSS:表现(美化网页) CSS2.0 DIV(块)+CSS,HTML与CSS结构分离的思想,网页变得简单,SEO CSS2.1 浮动,定位 CSS3.0 圆角,阴影,动画....游览器 ...

CSS3(Cascading Style Sheet) 层叠样式表

一、CSS基础

CSS3(Cascading Style Sheet) 层叠样式表相关推荐

最新文章

热门文章