首页 > 编程知识 正文

css样式表的功能(css有几种样式)

时间:2023-05-05 02:57:49 阅读:85574 作者:523

相信在阅读了主编日前发表的关于HTML的学习后,大家对网站建设和主页制作有一定的初步知识。 今天,我们将向大家介绍为美化HTML网页的排版而设计的css。 css是为了实现HTML无法设计的效果而设计的,一般与HTML一起使用。 一般模式:选择器{属性:值}即选择器字体大小: 12px; 他有三种导入方法:内联样式表、内部样式表和外部样式表。

css有三种嵌入方式。

一、内联风格

使用style属性引入CSS样式。

示例:

h1 style='color:red;' 应用样式属性/h1

p样式='字体大小:14 px; color :绿色;' 要直接设置为HTML标签的样式/p

实际写页面时不提倡使用,测试时可以使用。

例如:

! doctypehtmlheadmetacharset=' utf-8 '/title内联样式/title /头主体! - -使用内联样式部署CSS---- h1样式=' color : red;' lapingabovethewater/h1p样式=' color : red; 字体大小:30 px;' 我是p标签/p /body /html

二、内部样式表

在style标签中写入CSS代码。 style标签写在头标签上。

示例:

头部

样式类型='文本/CSS '

H3

颜色:红色;

}

/样式

/head

比如说! doctypehtmlheadmetacharset=' utf-8 '/title内部样式表/title! - -使用内部样式表指定CSS---- styletype=' text/CSS ' div {背景3360绿色; } /style /head body div我是DIV/div /body /html

三、外部样式表

CSS代码保存在扩展名为. CSS的样式表中

HTML文件引用扩展名为. css的样式表,有链接表达式和导入表达式两种方法。

语法:

1、连杆式

linktype='文本/CSS ' rel='样式表' href=' CSS文件路径' /

2、导入式

样式类型='文本/CSS '

@导入URL (CSS文件路径);

/样式

比如说! doctypehtmlheadmetacharset=' utf-8 '/title外部样式表/title! - -链接式:推荐- -链接列='样式表'类型='文本/CSS ' href=' CSS/style.CSS ' /! - -导入表达式----styletype='文本/CSS ' @导入URL (CSS/style.CSS );/style/headbodyolli 1111/Lili 2222/Li/ol/html

内嵌样式内部样式外部样式(后者为邻近原则)。

css注释的格式如下。

/*注释如下。 /

css的颜色值表示如下:

我可以直接写英语单词。 例如,蓝色尽量能写蓝色; 另外,也可以写入为#rrggbb#ffcc00等十六进制字符。 #rgb,例如:#fc0的十六进制的颜色可以用颜色表来查。 这里提供一个。 当然网上也有很多。 大家也可以自己百度一下。

另一种颜色的表示方法是rbg模式。 例如:

RGB(x、x、x )其中x是0-255的整数值,如:RGB ) 255、204、0 )

RGB(x%、x%、x% )其中,x是RGB(100%、80%、0% )等0-100的整数值

Css长度单位:

相对长度单位: px像素em相对于当前文本字体大小的倍数%

绝对长度单位:英寸(英寸)点)点)厘米(厘米)毫米)。

换算比例: 1in=2.54厘米=25.4毫米=72pt

Css的7个主要选择器:

标签选择器例如p{};

类别选择器例如. div{}; (点和命名类名)

Id选择器例如#div{}; (给斜体的井号赋予ID名称,ID不可重复,类可以相同。)

通配符选择器: *{};

伪类选择器:

a :链接访问时没有链接;

访问了a:visited{}过时的链接;

a :移动鼠标悬停时的链接;

a :活动{2}已选定的链接;

3360第一个字符{ }设置第一个字符的样式;

设置3360最后一个字符的样式;

: nth-child可以设置指定字符的样式

派生选择器(后代选择器、子元素选择器和相邻的同级选择器) :

后代选择器:用空格分隔

颜色: # 0099厘米; }

子元素选择器:用分隔开

UL沥

邻接兄弟选择器:是分隔符

div div ul li

最后是组合选择器。 请用逗号分隔

h1,h2,h3,h4,h5,h6 {颜色:绿色}

那么,css的基础就介绍到这里了。 如果有什么不明白的地方可以给编辑发消息。 如果有什么好建议的话,可以关注编辑。 我们一起学习,一起讨论,一起进步。 接下来我将介绍css的属性,敬请期待

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。