您好、欢迎来到现金彩票网!
当前位置:老k棋牌 > 干扰设备 >

CSS样式文件编写规范

发布时间:2019-07-14 16:14 来源:未知 编辑:admin

  网页文件的结构: html head title/title /head body /body /html 其中在网页中显示的部分都放在 body 中,不在网页中显示的部分都放在 head 中。 其中常放在 head 中的标签有:title、link、meta、base CSS 类型: 内联式:就是直接在 html 标签后面写样式代码,如: p style=”font-size:50px;color:red;text-deceration:line”啊啊啊啊/p 嵌入式:就是对本文件内所有的该类型的标签名运用这样的样式,但该样式的标签要放 在 head 中,如: html head title/title style P{ font-size:50px; color:red; text-deceration:line } /style /head body /body /html 这样的话, 该文件中的所有 P 标签都将应用该 style 样式, 而不需要在没一个 html 标签中写。 注:1、通常都要在样式的 style 标签下一层放一对 html 的注释标签!--//--,这是为了防止不支持 CSS 样式的浏览器不执行,或不显示其中的代码;而对于支持样式的浏览器,则可以正确识别 style 标 签,而使得注释标签不起作用。 2、在 syle 标签内还可以写 style 本身的一些属性,如 type=”text/css”等。 外部样式表: 虽然嵌入式样式表解决了同一个文件内使用同样样式的多个标签的代码重用, 但在一个网站 内往往是有很多个文件组成的, 如果这些独立的网页文件要使用统一的风格, 显然嵌入式样 式表仍然不能很好地实现代码的重用。这时就需要使用外部样式表了。 一般使用外部样式表时都是在网站的根目录下建一个单独的样式文件夹,命名为 style,然 后再在 style 文件夹内建立后缀名为 css 的文本文件。 在使用时,在引用该样式表的网页文件内的 head 标签中使用 link 标签来引入,如: Rel:指明连接的是什么文件; Type:指明引入的文件的格式类型; href:指明文件的路径,以引入文件为基准的相对路径。 注:引入文件内的样式的具体运用仍然和嵌入式的应用原理一样,即:根据样式内容的标签名来运用,如 嵌入式的 p。 输入式样式表: 指样式,CSS 文件之间的代码共享的一种代码重用方式。即使用@import 把一个 css 文件的 代码引入到另一个 css 样式文件内。如: 其中 url 是用来指明被引入的文件的位置,这里是在同一个文件夹内。 注:输入式样式表可以进一步细分样式模块,每个模块单独成文件,当需要对某个网页文件应用样式时, 通过使用输入代码把需要的模块代码引入到一个样式文件中,再把这个集成的样式文件使用 link 标签 引入到引用文件中。真正实现了 word 中的文本样式的组织形式。 同时,输入式样式表还可以输入到嵌入式样式表中的 style 标签内的!--//--内。 标签选择器: 标签选择器就是嵌入式样式表中的样式代码前的字符, 即: 用于进行判断具体使用哪段样式 代码的基准字符。共有以下几类: HTML selector:就是直接使用 html 标签做选择器; 注:HTML 标签选择器严格对应网页文件中的 html 标签,就是应用且只应用对应的 html 标签。这样就有 一个缺陷, 就是相同的标签要想实现不同的样式就很麻烦, 于是可以在 html 标签后面加赠一个扩展名, 在引用时只需在相同的 html 表前后加上: ‘class=html 标签选择器的扩展名’(class 本来就是 html 标 , 签的一个属性)从而实现了相同标签的个性化。同时还有另一个问题,就是不同的标签要想使用同样 的样式也不能实现。 这个解决办法就是,去掉选择器的标签名,只保留扩展名,这样一来,不管是相同的标签要实现个性 化,还是不同的标签要使用同样的样式,只需要在自己后面加一个 class 属性就可以了,这就是以“.” 开头的类选择器。 Class(类)selector:以点号开头的选择器,可以看作是省略了标签名的 html 选择器。 ID selector:在同一个网页文件内,同样的标签或不同的标签的 ID 值是不能相同的,ID 对 应一个特定的 html 标签元素。根据这一特点,可以利用 html 标签的 ID 来用 作样式的选择基准。在编写 ID selector 的样式时,只需把类选择器中的点号改成井号# 就可以了, 即凡是以#开头的选择器命名的样式文件都会根据 HTML 标签的 ID 值进行对应。 注:不难看出,ID 选择器只能为该网页文件内的一个标签所用。而类选择器则可以被多次使用。可据此选 用不同的选择器类型。 关联选择器:是专门针对 html 标签可以嵌套的规则制定的样式规则。也就是说,构成样 式选择器的标签字符是从左到右的多个 html 标签,标签之间用空格隔开。 这时,样式的代码将应用于与此嵌套绝对符合的 html 标签中的内容。如: Center div p {………….} 只能应用于centerdivp……/p/div/center 但样式选择器的规则显然不仅仅局限于 html 的规则,在样式选择器的嵌套规则中,html 标 签、类选择器标签、ID 选择器标签可以混杂嵌套,当然他们的应用也是要绝对对应于这样 的嵌套顺序的内容。 组合选择器:如果说关联选择器是严格对应嵌套的话,那么组合选择器则是恰恰相反,他 是把多个标签选择器字符(html 的、ID 的、累的等)并列放在一起做选择器 字符,各个字符之间用逗号隔开,则样式规则代码可以应用于包含在组合选 择器标签字符内的任何单个标签元素。如: Center, div, p {………….} 可应用于center……../center div………/div p……/p 伪元素选择器: 是指应用于同一个标签的不同状态的选择器字符。如连接的 a 标签,p 标签等。其写法是:标签名:状态名{}。如: a:link{} a:hover{} a:visited{} 当然,伪元素选择器不是每个 html 标签都能用的,只能应用于有多种状态的标签上。当然 也可以与组合选择器和类选择器连用。如::hover{} center div a:visited{} 网页布局: 网页中的点、线、面都可以使用 div 标签做出来。 网站的菜单来使用列表做出来的,即列表不是只能竖排列的。 浮动的清楚属性可能会冲突而导致页面布局紊乱。 页面内的各模块的尺寸不对也会导致页面布局紊乱。 选项卡的制作: 就是用一个包含 if 语句的循环来配置各个选项卡的 css 显示样式。

http://qandpahloo.com/ganraoshebei/186.html
锟斤拷锟斤拷锟斤拷QQ微锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷微锟斤拷
关于我们|联系我们|版权声明|网站地图|
Copyright © 2002-2019 现金彩票 版权所有