CSS计算机层叠样式语言的四大调用方法

CSS计算机层叠样式语言的四大调用方法

(图片来自网络)

学习目地:在前面我们了解过HTML与CSS发展历史。我们通过了解它们的发展历史得知,HTML计算机标记语言是网页的母语,CSS计算机层叠样式语言侧在背后一直控制着它,我们接下来就要搞清楚CSS计算机层叠样式语言是通过什么方式在背后控制这HTML计算机标记语言的变化。下面我简称CSS计算机层叠样式语言为“CSS”,看下我对CSS四大控制HTML的方法与CSS定义使用方法的讲解。

CSS四大控制手法

一、内部控制方法:

1.行内式

行内式是在标记的style属性中设定CSS样式。这种方式没有体现出CSS的优势,不推荐使用。

2.内嵌式

嵌入式是将CSS样式集中写在网页的标签对的标签对中。格式如下: 缺点是对于一个包含很多网页的网站,在每个网页中使用嵌入式,进行修改样式时非常麻烦。单一网页可以考虑使用嵌入式。

二、外部控制方法:

3.导入式

将一个独立的.css文件引入HTML文件中,导入式使用CSS规则引入外部CSS文件, 导入式会在整个网页装载完后再装载CSS文件,因此这就导致了一个问题,如果网页比较大则会儿出现先显示无样式的页面,闪烁一下之后,再出现网页的样式。这是导入式固有的一个缺陷。

4.链接式

也是将一个.css文件引入到HTML文件中,但它与导入式不同的是链接式使用HTML规则引入外部CSS文件,它在网页的标签对中使用

标记来引入外部样式表文件,使用语法如下:

使用链接式时与导入式不同的是它会以网页文件主体装载前装载CSS文件,因此显示出来的网页从一开始就是带样式的效果的,它不会象导入式那样先显示无样式的网页,然后再显示有样式的网页,这是链接式的优点。 总结:一般来说,做网站时把样式多写在多个样式表文件中,因此我们先用链接式引入一个总的CSS文件,然后在这个CSS文件中在使用导入式来引入其他的CSS文件。但如果通过JavaScrip来动态引入CSS文件则只能使用链接式,JavaScrip计算机语言我们以后在讲,这个不是我们今天要研究的对象。

CSS定义使用方法

前面我们了解了CSS的控制手法后,大家都知道了CSS控制HTML的手法一共有两种一个是外部控制一个是内部控制,我们下面就给大家讲下CSS语法,学会了CSS语法后我们结合之前的HTML语言就可开始玩HTML语言+CSS语言小程序了,这样我们又比以前又进步了一点点。

(图片来自网络,图1)

大家看下图1,h1,这个就是一个CSS语法定义,在这个CSS语法中,“h1”称为选择器我们可以理解h1是装东西的容器,“{}”花括号中的都是控制h1这个先择器的属性,每个属性都有自已特定的值。目地就是控制h1容器中装的东西,h1在HTML语言中是标题标签。下面我就写一个HTML+CSS简单的小程序给大看一下,给大家观察下他们的不同之处,如图2小程序代码案例准备。

(图片来自网络,图2)

(图片来自网络,图3)

例子很简单,图3就是HTML计算机标记言+CSS计算机层叠样式语言的一种组合运用效果。从明天开始我会慢慢的和大家介绍更多的HTML+CSS好玩的方法,还有很多的高级玩法有机会在给大家慢慢讲,我们现在目地是学基础,没有厚积薄发,房子是盖不高的,小程序也一样不从基础开始,到了上层建设会出问题的。

**************EMD**************

微信小程序兴趣交流群

部分内容参考网络,本文只限于学习交流请勿它用

***********************************

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20181225G0LFAA00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券