css3的三种使用方法分别是什么(css,web开发)

时间:2024-04-29 18:48:24 作者 : 石家庄SEO 分类 : web开发
  • TAG :

本教程操作环境:windows10系统、CSS3&&HTML5版、Dell G3电脑。

css3的三种使用方法是什么

一、内联样式

  内联样式通过style属性来设置,属性值可以任意的CSS样式。

<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>内联样式</title></head><body><pstyle="background:red">IloveChina!</p></body></html>

  显示效果:

css3的三种使用方法分别是什么

二、内部样式

  内部样式定义在文档的head部分,通过style标签来设置。需要使用元素选择器(p)来关联样式和要设置样式的标签(p标签)。

<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>内联样式</title><styletype="text/css">p{background:green;}</style></head><body><p>IloveChina!</p></body></html>

  效果:

css3的三种使用方法分别是什么

三、外部样式

  在文档外的*.css定义css样式,然后在文档的head部分通过link元素引入。  

<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>内联样式</title><linkrel="stylesheet"href="style.css"></head><body><p>IloveChina!</p></body></html>

  style.css文件内容:

p{background:yellow;}

  显示效果:

css3的三种使用方法分别是什么

  a.在一个外部样式表中导入其他样式表的样式

  combine.css文件中导入上面的style.css

@import"style.css";body{background:red;}

  HTML文件中引入combine.css文件

<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>document</title><linkrel="stylesheet"href="combine.css"></head><body><p>I<span>love</span>China!</p></body></html> 

  效果:

css3的三种使用方法分别是什么

 </div> <div class="zixun-tj-product adv-bottom"></div> </div> </div> <div class="prve-next-news">
本文:css3的三种使用方法分别是什么的详细内容,希望对您有所帮助,信息来源于网络。
上一篇:怎么在PHP中获取搜索引擎的来源下一篇:

12 人围观 / 0 条评论 ↓快速评论↓

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18