大橙子网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
CSS
我们提供的服务有:成都网站制作、网站设计、微信公众号开发、网站优化、网站认证、焉耆ssl等。为上千多家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的焉耆网站制作公司
释义一
CSS(Cascading Style Sheets),即层叠样式表,与HTML超文本标记语言配合以定义网页表现的样式语言。
历史
当初一帮技术人员想出HTML,主要侧重于定义内容,比如p表示一个段落,h1表示标题,而并没有过多设计HTML的排版和界面效果。
随着Internet的迅猛发展,HTML被广泛应用,上网的人们当然希望网页做得漂亮些,因此HTML排版和界面效果的局限性日益暴露出来。为了解决这个问题,人们也走了不少弯路,用了一些不好的方法,比如给HTML增加很多的属性结果将代码变得很臃肿,将文本变成图片,过多利用Table来排版,用空白的图片表示白色的空间等。直到CSS出现。
CSS可算是网页设计的一个突破,它解决了网页界面排版的难题。可以这么说,HTML的Tag主要是定义网页的内容(Content),而CSS决定这些网页内容如何显示(Layout)。
CSS与网页的链接方法
内嵌样式(Inline Style)
内部样式表(Internal Style Sheet)
外部样式表(External Style Sheet)
内嵌样式(Inline Style)
Inline Style是写在Tag里面的。内嵌样式只对所在的Tag有效。
P style="font-size:20pt; color:red"这个Style定义p/p里面的文字是20pt字体,字体颜色是红色。/p
显示示例
内部样式表(Internal Style Sheet)
内部样式表是写在HTML的head/head里面的。内部样式表只对所在的网页有效。
HTML
HEAD
STYLE type="text/css"
H1.mylayout {border-width:1; border:solid; text-align:center; color:red}
/STYLE
/HEAD
BODY
H1 class="mylayout" 这个标题使用了Style。/H1
H1这个标题没有使用Style。/H1
/BODY
/HTML
显示示例
内部样式表(Internal Sytle Sheet)要用到Style这个Tag,写法如下:
STYLE type="text/css"
......
/STYLE
外部样式表(External Style Sheet)
如果很多网页需要用到同样的样式(Styles),用什么方法呢?
将样式(Styles)写在一个以.css为后缀的CSS文件里,然后在每个需要用到这些样式(Styles)的网页里引用这个CSS文件。
比如可以用文本编辑器(NotePad)建立一个叫home的文件,文件后缀不要用.txt,改成.css。文件内容如下:
H1.mylayout {border-width: 1; border: solid; text-align: center;color:red}
然后你建立一个网页,代码如下:
HTML
HEAD
link href="../asdocs/css_tutorials/home.css" rel="stylesheet" type="text/css"
/HEAD
BODY
H1 class="mylayout" 这个标题使用了Style。/H1
H1这个标题没有使用Style。/H1
/BODY
/HTML
显示示例
使用外部(Extenal)样式表,相对于内嵌(Inline)和内部式(Internal)的,有以下优点:
样式代码可以复用。一个外部CSS文件,可以被很多网页共用。
便于修改。如果要修改样式,只需要修改CSS文件,而不需要修改每个网页。
提高网页显示的速度。如果样式写在网页里,会降低网页显示的速度,如果网页引用一个CSS文件,这个CSS文件多半已经在缓存区(其它网页早已经引用过它),网页显示的速度就比较快。
解决css文件过大的问题
如果页面内容过多,css文件会很大,同样会造成很多不便,那么我们该如何解决这个问题呢?我们可以对每个细节进行css设计,比如对于字体的设置我们可以存入font.css文件,对边界等的设定我们可以存入lay.css文件,对其他一些版式的规定可以存入other.css文件,然后我们建立一个main.css文件,然后在里边写入如下代码:
@import url(font.css);
@import url(lay.css);
@import url(other.css);
然后只需要在html文件里添上main.css的链接即可,这样子一方面减小了css文件的容量,另一方面似乎也更方便管理,特别是对大型网站。
串联(Cascading)
CSS第一个字母,是Cascading,意为串联。它是指不同来源的样式(Styles)可以合在一起,形成一种样式。
Cascading的顺序是:
浏览器缺省(browser default)(优先级最低)
外部样式表(Extenal Style Sheet)
内部样式表(Internal Style Sheet)
内嵌样式表(Inline Style)(优先级最高)
样式(Styles)的优先级依次是内嵌(inline), 内部(internal), 外部(external), 浏览器缺省(browser default)。假设内嵌(Inline)样式中有font-size:30pt, 而内部(Internal)样式中有font-size:12pt,那么内嵌(Inline)式样式就会覆盖内部(Internal)样式。
css是样式编辑的啊 没有逻辑 他只是一个翻译型语言, 你让他干什么 他就干什么,比方说你上面的代码 margin-bottom:0px 这个的意思 你翻译成中文 你就很好理解了 margin是外边距,bottom 这个是下 一起就是下面的外边距是0 color 这个是颜色 后面跟着相应的颜色代码
CSS是Cascading Style Sheet 的缩写。译层叠样式表单、集联样式表等。
举个例子。比如table或div就是做房子的砖瓦,用他们把整个网站的框架搭好。而css就是房子的装饰。一个网站没有修饰是很难看的。
我们用CSS通常来修饰网站的色彩,文字等等。
要想了解更多关于CSS的,可以在网上搜搜,网上很多的。我只是用我的实践跟你讲。最后我只想说,样式和架框是分不开的。希望对你有帮助。
css是层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS为HTML标记语言提供了一种样式描述,定义了其中元素的显示方式。CSS在Web设计领域是一个突破。利用它可以实现修改一个小的样式更新与之相关的所有页面元素。
CSS具有以下特点:
1、丰富的样式定义
CSS提供了丰富的文档样式外观,以及设置文本和背景属性的能力;允许为任何元素创建边框,以及元素边框与其他元素间的距离,以及元素边框与元素内容间的距离;允许随意改变文本的大小写方式、修饰方式以及其他页面效果。
2、易于使用和修改
CSS可以将样式定义在HTML元素的style属性中,也可以将其定义在HTML文档的header部分,也可以将样式声明在一个专门的CSS文件中,以供HTML页面引用。总之,CSS样式表可以将所有的样式声明统一存放,进行统一管理。
3、多页面应用
CSS样式表可以单独存放在一个CSS文件中,这样我们就可以在多个页面中使用同一个CSS样式表。CSS样式表理论上不属于任何页面文件,在任何页面文件中都可以将其引用。这样就可以实现多个页面风格的统一。
4、层叠
层叠就是对一个元素多次设置同一个样式,这将使用最后一次设置的属性值。例如对一个站点中的多个页面使用了同一套CSS样式表,而某些页面中的某些元素想使用其他样式,就可以针对这些样式单独定义一个样式表应用到页面中。
5、页面压缩
在使用HTML定义页面效果的网站中,往往需要大量或重复的表格和font元素形成各种规格的文字样式,这样做的后果就是会产生大量的HTML标签,从而使页面文件的大小增加。
而将样式的声明单独放到CSS样式表中,可以大大的减小页面的体积,这样在加载页面时使用的时间也会大大的减少。另外,CSS样式表的复用更大程序的缩减了页面的体积,减少下载的时间。
扩展资料:
css的工作原理
CSS是一种定义样式结构如字体、颜色、位置等的语言,被用于描述网页上的信息格式化和现实的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。
无论哪一种方式,样式单包含将样式应用到指定类型的元素的规则。外部使用时,样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中。
样式规则是可应用于网页中元素,如文本段落或链接的格式化指令。样式规则由一个或多个样式属性及其值组成。内部样式单直接放在网页中,外部样式单保存在独立的文档中,网页通过一个特殊标签链接外部样式单。
名称CSS中的“层叠(cascading)”表示样式单规则应用于HTML文档元素的方式。具体地说,CSS样式单中的样式形成一个层次结构,更具体的样式覆盖通用样式。样式规则的优先级由CSS根据这个层次结构决定,从而实现级联效果。
参考资料:百度百科_css
CSS是Cascading Style Sheet 的缩写。译作「层叠样式表单」。是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。链入外部样式表文件 (Linking to a Style Sheet) 你可以先建立外部样式表文件(.css),然后使用HTML的link对象。示例如下: head titletitle of article/title link rel=stylesheet href=" " type="text/css"/head 而在XML中,你应该如下例所示在声明区中加入: ? xml-stylesheet type="text/css" href=" " ?定义内部样式块对象 (Embedding a Style Block) 你可以在你的HTML文档的HTML和BODY标记之间插入一个STYLE.../STYLE块对象。 定义方式请参阅样式表语法。示例如下: html style type="text/css" !-- body {font: 10pt "Arial"} h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon} h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue} p {font: 10pt/12pt "Arial"; color: black} -- /style body 请注意,这里将style对象的type属性设置为"text/css",是允许不支持这类型的浏览器忽略样式表单。 内联定义 (Inline Styles) 内联定义即是在对象的标记内使用对象的style属性定义适用其的样式表属性。示例如下: 这一行被增加了左右的外补丁 样式表语法 (CSS Syntax) Selector { property: value } 参数说明: Selector -- 选择符 property : value -- 样式表定义。属性和属性值之间用冒号(:)隔开。定义之间用分号(;)隔开 继承的值 (The ' Inherit ' Value) 每个属性都有一个指定的值:Inherit。它的意思是:将父对象的值等同为计算机值得到。这个值通常仅仅是备用的。显式的声明它可用来强调。 选择符说明: #表示选择id .表示选择class 比如我有个 这时就得用#test{属性}来给id为test的div来制定样式 而 则应该用.test{属性}来给其指定样式。 编辑本段根据分辨率不同,调用不同的css文件 dotted; TABLE-LAYOUT: fixed; BORDER-TOP: #cccccc 1px dotted; BORDER-LEFT: #cccccc 1px dotted; BORDER-BOTTOM: #cccccc 1px dotted" cellSpacing=0 cellPadding=6 width="95%" align=center border=0 SCRIPT LANGUAGE="javascript" !-- if (window.navigator.userAgent.indexOf("MSIE")=1) { var IE1024=""; var IE800=""; var IE1152=""; var IEother=""; ScreenWidth(IE1024,IE800,IE1152,IEother) }else{ if (window.navigator.userAgent.indexOf("Firefox")=1) { file://如果浏览器为Firefox var Firefox1024=""; var Firefox800=""; var Firefox1152=""; var Firefoxother=""; ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother) }else{ file://如果浏览器为其他 var Other1024=""; var Other800=""; var Other1152=""; var Otherother=""; ScreenWidth(Other1024,Other800,Other1152,Otherother) } } function ScreenWidth(CSS1,CSS2,CSS3,CSS4){ if ((screen.width == 1024) (screen.height == 768)){ setActiveStyleSheet(CSS1); }else{ if ((screen.width == 800) (screen.height == 600)){ setActiveStyleSheet(CSS2); }else{ if ((screen.width == 1152) (screen.height == 864)){ setActiveStyleSheet(CSS3); }else{ setActiveStyleSheet(CSS4); }}} } function setActiveStyleSheet(title){ document.getElementsByTagName("link")[0].href="style/"+title; } ; /SCRIPT 解释: var IE1024=""; var IE800=""; var IE1152=""; var IEother=""; 引号里面分别填写,用户使用IE的时候并且分辨率为1024*768,800*600,1152*864要使用的css文件名. var Firefox1024=""; var Firefox800=""; var Firefox1152=""; var Firefoxother=""; 引号里面分别填写,用户使用FF的时候并且分辨率为1024*768,800*600,1152*864要使用的css文件名. var Other1024=""; var Other800=""; var Other1152=""; var Otherother=""; 引号里面分别填写,用户使用其他浏览器的时候并且分辨率为1024*768,800*600,1152*864要使用的css文件名. 不判断分辨率,只判断浏览器 应E.Qiang提议,编如下代码。实现根据浏览器类型自动调用不同CSS。 代码: SCRIPT LANGUAGE="javascript" !-- if (window.navigator.userAgent.indexOf("MSIE")=1) { file://如果浏览器为IE setActiveStyleSheet("default.css"); }else{ if (window.navigator.userAgent.indexOf("Firefox")=1) { file://如果浏览器为Firefox setActiveStyleSheet("default2.css"); }else{ file://如果浏览器为其他 setActiveStyleSheet("newsky.css"); } } function setActiveStyleSheet(title){ document.getElementsByTagName("link")[0].href="style/"+title; } ; /SCRIPT 解释: 如果浏览器为IE,则调用default.css 如果浏览器为Firefox,则调用default2.css 如果浏览器为其他,则调用newsky.css 用法:放在head/head中即可。 中国专业css标准化推广网站 【Div之家】 css 层叠样式表 引入层叠样式表的方法包括: 1,外联式样式表 2,内嵌样式表 3,元素内定 4,导入样式表 外联式样式表 例:head link rel="stylesheet" href="/css/default.css" /head body .... /body /html 属性:rel 用来说明link元素在这里要完成的任务是连接一个独立的css文件。而href属性给出了所要连接css文件的url地址 内嵌式样式表: 例:html head style type="text/css" !-- td{font:9pt;color:red} .font105{font:10.5pt;color:blue} -- /style /head body..../body /html 元素内定 格式: 导入式样式表 〈html head style type="text/css" !-- @import url(css/home.css); -- /style body .... /body /html
[img]CSS就是一种叫做样式表(stylesheet)的技术。也有的人称之为层叠样式表(Cascading Stylesheet)。
在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。
只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。
它的作用可以达到:
(1)在几乎所有的浏览器上都可以使用。
(2)以前一些非得通过图片转换实现的功能,现在只要用CSS就可以轻松实现,从而更快地下载页面。
(3)使页面的字体变得更漂亮,更容易编排,使页面真正赏心悦目。
(4)你可以轻松地控制页面的布局 。
(5)你可以将许多网页的风格格式同时更新,不用再一页一页地更新了。你可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。
想一想,没有使用CSS前我们是如何控制字体的颜色和大小以及所使用的字体的?我们一般使用HTML标签来实现,代码非常烦琐。
很难想象,如果在一个页面里需要频繁地更替字体的颜色大小,最终生成的HTML代码的长度一定臃肿不堪。
说实话,CSS就是为了简化这样的工作诞生的,当然其功能决非这么简单。
CSS是通过对页面结构的风格控制的思想,控制整个页面的风格的。
式样单放在页面中,通过浏览器的解释执行,是完全的文本,任何懂得HTML的人都可以掌握,非常的容易。生殖对一些非常老的浏览器,页不会产生页面混乱的现象。