CSS样式的基础学习

论坛 期权论坛     
匿名小用户   2019-10-20 18:36   97   0
<p align="center"><span style="font-family:'KaiTi_GB2312';font-size:18px;"><br></span></p>
<h1><span style="font-family:'KaiTi_GB2312';font-size:18px;">一.CSS基本介绍 </span></h1>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行网页风格设计的。比如,如果想让链接字未点击时是蓝色的,当鼠标移上去后字变成红色的且有下划线,这就是一种风格。通过设立样式表,可以统一地控制HTML中各标志的显示属性。级联样式表可以使人更能有效地控制网页外观。使用级联样式表,可以扩充精确指定网页元素位置,外观以及创建特殊效果的能力。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">CSS是英语CascadingStyle Sheets(层叠样式表单)的缩写,它是一种用来表现HTML或XML等文件样式的计算机语言。CSS目前最新版本为CSS3,是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言,CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计,是目前基于文本展示最优秀的表现设计语言。CSS能够根据不同使用者的理解能力,简化或者优化写法,针对各类人群,有较强的易读性。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;"></span></p>
<h1><span style="font-family:'KaiTi_GB2312';font-size:18px;">二.CSS的使用方法</span></h1>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">有三种方法可以在站点网页上使用样式表:</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">外部样式:将网页链接到外部样式表。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">内页样式:在网页上创建嵌入的样式表。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">行内样式:应用内嵌样式到各个网页元素。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">每一种方法均有其优缺点:</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">当要在站点上所有或部分网页上一致地应用相同样式时,可使用外部样式表。在一个或多个外部样式表中定义样式,并将它们链接到所有网页,便能确保所有网页外观的一致性。如果人们决定更改样式,只需在外部样式表中修改一次,而该更改会反映到所有与该样式表相链接的网页上。通常外部样式表以 .css 做为文件扩展名,例如牛腩新闻发布系统中的公共样式Common.css。然后在需要此样式的页面中将其链接进来,如:</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">&lt;link href="/css/Common.css"rel="stylesheet" type="text/css"/&gt;</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">当人们只是要定义当前网页的样式,可使用嵌入的样式表。嵌入的样式表是一种级联样式表,“嵌”在网页的 &lt;HEAD&gt;标记符内。嵌入的样式表中的样式只能在同一网页上使用。 如:</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">&lt;style type="text/css"&gt;&lt;!-- /* 把声明的样式包含在一个html注释中,这样可以解决较老的浏览器不识别style的问题 */</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">body {background:grey;}</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">&lt;/style&gt;</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">使用内嵌样式以应用级联样式表属性到网页元素上。如:</span></p>
<p align="left"><em><span style="font-family:'KaiTi_GB2312';font-size:18px;">&lt;pstyle="@importurl('style3.css');"&gt;CSS document&lt;/p&gt;</span></em></p>
<p align="left"><em><span style="font-family:'KaiTi_GB2312';font-size:18px;">&lt;!-- 不能在style属性中使用@import --&gt;</span></em></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">如果网页链接到外部样式表,为网页所创建的内嵌的或嵌入式样式将扩充或覆盖外部样式表中的指定属性。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">要在网页上使用外部样式表的样式,可将该网页链接到样式表,方法是使用位于 “格式” 菜单上的 “样式表连接” 命令。可以链接一个或数个样式表到网页视图模式下的当前网页,或到在文件夹列表中的所选网页,或到站点上的全部网页。</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">该“样式” 框列出标准 HTML 标记符,例如标题</span></p>
<p align="left"><span style="font-family:'KaiTi_GB2312';font-size:18px;">1,还有嵌入的样式表或链接到网页的
分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:50
帖子:1079
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP