首页 web前端 css教程 第一章 CSS的基本认识

第一章 CSS的基本认识

Dec 19, 2016 pm 04:00 PM

关 於 C S S 的 概 论

   

  CSS是『Cascading Style Sheets』的简称,中文翻为「串接样式表」,也有人只翻为「样式表」。CSS用以作为网页的排版与风格设计,在所谓的「新式网页」里 ,CSS不容置疑是相当重要的一环。CSS是以既有的基础,用以弥补既存HTML 规格里的不足,也让网页的设计更为灵活。  这份教学文件就要来为您介绍CSS的应用罗!在这边并不介绍CSS的所有规格 ,仅就您在网页写作上较常用到,较可能用到的语法部份及应用的方法来为您作介绍。也 由於现在两浏览器的相容是渐行渐远,将贴心地为您注明支援该语法的浏览器。而IE从 3.0开始便支援部份语法了,这点也会为为您注明的。    

各 章 节 的 概 略 介 绍

   

  为了您参考与学习上的方便,在这里先为您大略地说明一下这份教学文件各章节所包含的内容吧!让您在参考时有个方向与概念。基本上,前两章著重於概念与基本认知的建立,也就是一些为您做一些札根的工作;第三章则为您补充在应用与设定上的一些其它方式或特性的说明与介绍。而第四章到第六章则著重於语法、参数与性质的介绍,也 就是真正建立在样式表里面的东东。第一章 CSS的基本认识:就是本章啦!就介绍您一些CSS基本概念与认识。第二章 CSS的应用方式:为您介绍CSS的基本宣告、应用方法与特性介绍。第三章 CSS的应用补充:为您介绍CSS的其它宣告方式、应用与特性介绍。第四章 页面性质的CSS:为您介绍页面性质的CSS相关语法、参数与性质。第五章 文字性质的CSS:为您介绍文字性质的CSS相关语法、参数与性质。第六章 区块性质的CSS:为您介绍区块性质的CSS相关语法、参数与性质。    

应 用 上 的 基 本 认 识

   

  应用CSS并不困难,但是请您先参考这里的基本认识,对一些用语有了一点基本概念後,对於您在看後面的教学会有助益,看起来也才不会太吃力!一、基本用语的认识:元件(element):亦即HTML基本语法中的标签(tag)。属性(attribute):用以描述标签特性的属性。例如:


中,HR为标签,WIDTH为属性,而80%即为WIDTH属性的值。性质(PRoperty):用以描述元件的特性。相当於HTML基本 语法中的属性。样式(style):拥有一组或数组的性质,用以描述元件特性。挑选者(selector):套用样式的元件。例如:H3{ COLOR : BLUE }中,H3为挑选者,COLOR为性质,BLUE为COLOR性质的值。二、基本单位的认识: 有相对单位与绝对单位两种单位 表达方式。相对单位:『em』:相对於字母高度的比例因子。『en』:相对於字型大小的比例因子。『%』:相对於长度单位(通常是目前字型的大小)的百分比例。绝对单位:『in』:英寸。『cm』:公分。『mm』:公厘。『px』:像素(系统预设单位)。『pc』:pica,印刷活字单位。『pt』:像点。相对关系:1in= 6pc= 72pt= 2.54cm= 25.4mm三、颜色使用的认识:颜色的表示共有五种方式。『#RRGGBB』:以三个00到FF的十六进位值分别表示0到255十进位值的红、绿、蓝三原色数值。『#RGB』:简略表示法,只用三个0到F的十六进位值分别表示红、绿、蓝三原色数值。而事实上,浏览器会自动扩展为六个十六进位的值,如『#ABC』将变为『#AABBCC』。但是,显见这样的 表示法并不精确。『rgb(R,G,B)』:以0到255十进位值的红、绿、蓝三原色数值来表示颜色。『rgb(R%,G%,B%)』:以红、绿、蓝彼此相对的数值比例来表示颜色,如『rgb(60%,100%,75%)』。『Color_Name』:直接以颜色名称来表示颜色,共有141种标准的颜色名称。四、URL表示法的认识:CSS的URL表示共有五 种方式,且都为合法宣告,您可以自行选用。    


 以上就是第一章 CSS的基本认识的内容,更多相关内容请关注PHP中文网(www.php.cn)! 


本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

将框阴影添加到WordPress块和元素 将框阴影添加到WordPress块和元素 Mar 09, 2025 pm 12:53 PM

CSS盒子阴影和轮廓属性获得了主题。让我们查看一些在真实主题中起作用的示例,以及我们必须将这些样式应用于WordPress块和元素的选项。

使用智能表单框架创建JavaScript联系表格 使用智能表单框架创建JavaScript联系表格 Mar 07, 2025 am 11:33 AM

本教程演示了使用智能表单框架创建外观专业的JavaScript表单(注意:不再可用)。 尽管框架本身不可用,但原理和技术仍然与其他形式的建筑商相关。

揭开屏幕读取器的神秘面纱:可访问的表格和最佳实践 揭开屏幕读取器的神秘面纱:可访问的表格和最佳实践 Mar 08, 2025 am 09:45 AM

这是我们在形式可访问性上进行的小型系列中的第三篇文章。如果您错过了第二篇文章,请查看“以:focus-visible的管理用户焦点”。在

创建一个具有可满足属性的内联文本编辑器 创建一个具有可满足属性的内联文本编辑器 Mar 02, 2025 am 09:03 AM

构建内联文本编辑器并不是微不足道的。 该过程首先要使目标元素可编辑,并在此过程中处理潜在的语法异常。 创建您的编辑器 要构建此编辑器,您需要动态修改内容

使用GraphQL缓存 使用GraphQL缓存 Mar 19, 2025 am 09:36 AM

如果您最近开始使用GraphQL或审查了其优点和缺点,那么您毫无疑问听到了诸如“ GraphQl不支持缓存”或

使您的第一个自定义苗条过渡 使您的第一个自定义苗条过渡 Mar 15, 2025 am 11:08 AM

Svelte Transition API提供了一种使组件输入或离开文档(包括自定义Svelte Transitions)时动画组件的方法。

比较5个最佳的PHP形式构建器(和3个免费脚本) 比较5个最佳的PHP形式构建器(和3个免费脚本) Mar 04, 2025 am 10:22 AM

本文探讨了Envato Market上可用的PHP表单构建器脚本,比较了其功能,灵活性和设计。 在研究特定选项之前,让我们了解PHP形式构建器是什么以及为什么要使用一个。 PHP形式

在node.js中使用multer上传并上传express 在node.js中使用multer上传并上传express Mar 02, 2025 am 09:15 AM

该教程通过使用node.js,express和multer构建文件上传系统来指导您。 我们将介绍单个和多个文件上传,甚至演示在MongoDB数据库中存储图像以进行以后的检索。 首先,设置您的projec

See all articles