css样式语法

发布 2021-05-11 04:54:28 阅读 8629

css(cascading styel sheet)是控制 web 页面外观的一系列格式设置规则,是网页设计必不可少的工具之一。我们下面就开始学习css的基本语法格式。

一、组成部分:

层叠样式表是一个完全的纯文本文件,通常以“css”为扩展名作为单独的文件来使用,它的内容包含了一组告诉浏览器,如何安排与显示特定的html标签中内容的规则,css定义规则由三个部分构成:选择符(selector),属性(properties)和属性的取值(value)。

二、基本格式:

selector

(选择符 )

选择符可以是多种形式,一般是你要定义样式的html标记,例如body、p、table……,你可以通过此方法定义它的属性和值,属性和值要用冒号隔开:

body

选择符body是指页面主体部分,color是控制文字颜色的属性,black是颜色的值,此例的效果是使页面中的文字为黑色。

如果属性的值是多个单词组成,必须在值上加引号,比如字体的名称经常是几个单词的组合:

p (定义段落字体为sans serif)

如果需要对一个选择符指定多个属性时,我们使用分号将所有的属性和值分开:

p (段落居中排列;并且段落中的文字为红色)

为了使定义的样式表方便阅读,可以采用分行的书写格式:

p (段落排列居中,段落中文字为黑色,字体是arial)

三、类选择符:

用类选择符能够把相同的元素分类定义不同的样式,定义类选择符时,在自定类的名称前面加一个点号。类的名称可以是任意英文单词或以英文开头与数字的组合,一般以其功能和效果简要命名。假如想要两个不同的段落,一个段落向右对齐,一个段落居中,你可以先定义两个类:

然后用不在不同的段落里,只要在html标记里加入你定义的class参数:

这个段落向右对齐。

这个段落居中对齐。

四、id选择符:

在html页面中id参数指定了某个单一元素,id选择符是用来对这个单一元素定义单独的样式。id选择符的应用和类选择符类似,只要把class换成id即可。定义id选择符要在id名称前加上一个“#”号。

五、包含选择符:

可以单独对某种元素包含关系定义的样式表,元素1里包含元素2,这种方式只对在元素1里的元素2定义,对单独的元素1或元素2无定义,例如:

table a

在**内的链接改变了样式,文字大小为12象素,而**外的链接的文字仍为默认大小。

六、样式表和html文件相关联的方法:

1.嵌入式:

在html页面内部定义的css样式表,叫做嵌入式css 样式表,也就是在html文档的head部分中,使用 style 标签并在该标签中定义一系列 css 规则。

语法:说明:,在开始标志 中可以根据需要添加一些属性,如上列中的属性type="text/css",它表示css样式表采用mime类型,这种类型的特点是,当浏览器不支持css**时,对css**进行过滤,避免浏览器以源**的方式显示css**。

为了保证更加可靠,避免不支持css的浏览器将css内容作为网页正文显示在页面上,在样式表里再次加上注释标识符"

2.链接式:

外部css样式表是一个以 .css为后缀的外部文件,定义一个外部样式表可以应用于多个页面。在html页面中使用link标签,可以将外部的css样式表连接进来,其语法如下:

参数: rel属性表示样式表将以何种方式与html文档结合。rel取值:stylesheet,表示指定一个外部的样式表。*.css是单独保存的样式表文件。

3.行内样式:

行内样式指的是,在html特定的标签中定义的css样式表。常用的html 标签主要是body中的一些元素,例如:,,等。

如:it部落窝。

4.导入式:

导入外部样式表指的是,在html文件中已经建立了嵌入式样式表,但是还要使用外部样式表的某些设置,这时就可以在里导入一个外部样式表,导入时用@import,如下例所示。

其中@import url(""表示导入样式表,导入外部样式表必须在样式表的开始部分,在内部样式表的上面。

七、注释:

可以在css中插入注释来说明你**的意思,注释有利于你或别人以后编辑和更改**时理解**的含义。在浏览器中,注释是不显示的。css注释以"/*开头,以"*/结尾。

示例如下:

/* 定义段落样式表 */p

text-align: center; /文本居中排列 */

color: black; /文字为黑色 */

font-family: arial /*字体为arial */

CSS样式语法基础

1.基本语法。css的定义是由三个部分构成 选择符 selector 属性 properties 和属性的取值 value 基本格式如下 selector 选择符 选择符是可以是多种形式,一般是你要定义样式的html标记,例如body p table 你可以通过此方法定义它的属性和值,属性和值要用冒...

CSS语法

基本语法。一个样式 style 的语法由三部分构成 selector 中文叫选择器有点怪怪的,就用英文吧 属性 property 属性值 value selector 举个例子,下面的 p就是selector,color就是属性,blue就是属性值。p html中所有的tag都可以作为selecto...

CSS语法

基本语法。一个样式 style 的语法由三部分构成 selector 中文叫选择器有点怪怪的,就用英文吧 属性 property 属性值 value selector 举个例子,下面的 p就是selector,color就是属性,blue就是属性值。p html中所有的tag都可以作为selecto...