当前位置

首页 > 游戏数码 > 电脑 > 如何创建css:设置样式表

如何创建css:设置样式表

推荐人: 来源: 常识咖 阅读: 1.31W 次

如何使用css设置样式?今天给大家分享下学习css初的时候,怎么用也就是创建。css设置样式分为三大类:外部样式表、内部样式表、内联样式。让我们一起来了解下吧

操作方法

(01)在桌面新建一个“文件夹”,然后在文件夹下建一个“txt文件”。

如何创建css:设置样式表
如何创建css:设置样式表 第2张

(02)在txt文件下增加标准网页声明<!doctype html>,这个习惯是非常有必要的。内部样式表:增加方式为在head标签内部增加<style>各种样式声明(class对应方式.{}id对应方式#{}元素(如p元素)对应方式p{})</style>.

如何创建css:设置样式表 第3张

(03)内部样式表声明完成后,把txt文件另存为所有文件,然后追加后缀,发现出现新html文档,双击打开方式搜狗浏览器。可以看到对应样式设置效果。

如何创建css:设置样式表 第4张
如何创建css:设置样式表 第5张
如何创建css:设置样式表 第6张

(04)除了内部样式表这种方式在网页内部增加样式外,还有内联样式这种方式来设置样式。首选我们把上步注释掉,然后查看效果。并设置内联样式具体操作方式如下:

如何创建css:设置样式表 第7张
如何创建css:设置样式表 第8张
如何创建css:设置样式表 第9张
如何创建css:设置样式表 第10张

(05)在网页内部增加样式,代码容易被别人copy,所以还有一种外部样式表,让css存在于另外的文件下,先创建一个css文档,直接编辑样式就行啦。最后只需另存为后缀。具体如下:

如何创建css:设置样式表 第11张
如何创建css:设置样式表 第12张

(06)完成外部css编辑以后,就是如何在html内引用外部外部样式表,引用在head内<link rel="stylesheet"  type="text/css" href="url">然后浏览。

如何创建css:设置样式表 第13张
如何创建css:设置样式表 第14张

特别提示

建议使用txt编辑静态网站保持良好的习惯

外部样式表、内部样式表、内联样式三种样式你都使用。可以看看优先级。这个你可以自行测试