Css教程列表

  •     在用CSS进行网站设计时,会遇到一种情况:相同的标志可能在不同的地方显示的效果不一样。怎么办呢,有一种办法即是采用上节所讲的直接插入式,逐个逐个地进行属性设置,如果该类标志比较少,这倒还可以;如果多了,可就有点令人厌烦了。  解决的办法就是采用样式类。  样式类,顾名思义是样式的分类,它可以根据不同的风格需要对某一类型的标志设置几种不同的CSS属性,也可以对整个风格分成几个类而不是只针对某一种类型的标志。   一、样式... 阅读全文>>
  •     alpha滤镜给我们制作网页特效提供了较大的创作空间,但由于它控制参数较多,在实际应用时,为了确定一组合适的参数值,不得不反复调整修改,在编辑窗口和预览窗口来回倒腾,甚是麻烦。我在这里给你介绍一种方法……    alpha滤镜给我们制作网页特效提供了较大的创作空间,但由于它控制参数较多,在实际应用时,为了确定一组合适的参数值,不得不反复调整修改,在编辑窗口和预览窗口来回倒腾,甚是麻烦。我在... 阅读全文>>
  •     一段文本或一张图片,它的周围有一圈光晕,这圈光晕每一秒钟闪烁一次,而当鼠标移到上面时,立即停止闪烁,当鼠标移开时又继续闪烁。这种效果用于那些需要特别引起别人注意的内容上……  一段文本或一张图片,它的周围有一圈光晕,这圈光晕每一秒钟闪烁一次,而当鼠标移到上面时,立即停止闪烁,当鼠标移开时又继续闪烁。这种效果用于那些需要特别引起别人注意的内容上(如:警示、报告新增内容等),能起到较好的效果。请看下面的效果图:   上面这... 阅读全文>>
  •      Invert属性   Invert属性可以把对象的可视化属性全部翻转,包括色彩、饱和度和亮度值。  它的表达式也很简单:  Filter:Invert   我们再来看一下加上Invert属性前后的图片效果变化(如下图):原图     Invert属性效果图  我们看到Invert属性实际上达到的是一种“底片”的效果。  自己拿别的图来试试吧。     Glow属性  ... 阅读全文>>
  •     DropShadow属性  DropShadow属性是为了添加对象的阴影效果的。它实现的效果看上去就像使原来的对象离开页面,然后在页面上显示出该对象的投影。看一看它的表达式:  Filter:DropShadow(Color=color,Offx=Offx,Offy=offy,            Positive=positive)   该属性一共有四个参数: Color代表投射阴影的颜色。 Offx和offy分别... 阅读全文>>
  •  [本站原创]在很多人眼里,CSS只能用来设置文字的字体、颜色,好像功能一般。其实CSS如果和JavaScript结合使用可以制作出非常出色的页面效果。大家知道,要想制作出条理清晰的网站,使用框架页是一种简便的方法,可是框架页的制作相当繁琐,而且在对齐上经常有些困难。本文将介绍如何使用CSS实现框架页效果。A、介绍原理使用CSS制作框架页的基本原理是将多个页面的内容集合到一个文件中,每个页面的内容占据一个表格,再建立一个表格作导航栏,然后通过CS... 阅读全文>>
  •     您可以利用下列 3 种方式,将 CSS 指定的格调加诸于网页上:     1. 在 HTML 档案里加一个超连结,连到外在的 CSS 档     这个方法最方便管理整个网站的网页风貌。它让网页的文字内容与版面设计分开。您只要在一个 CSS 档内(副档名为 .CSS)定义好网页的外观风格,所有参考连结到此 CSS 档的网页,便会依照指示,反应出定义好的风格。 &... 阅读全文>>
  •     经常有朋友问:如何使有超级连接的文字不出现下划线,如何使鼠标移动到超连上产生变色的效果?其实这些通过传统的方法是办不到的。而使用CSS的控制却可以非常轻松地作到,而且,页面的代码也不会臃肿。     ★★先看看超连没有下划线的例子:    例子1: 这个连接可以去页面底部,但是没有下划线。    是如何作到这一点的呢?在... 阅读全文>>
  •     ★☆★使用CSS你可以对页面的字体进行任意的控制,比起HTML简直方便不知多少。     CSS使用“font-size”属性来控制字体大小。    CSS中可以使用的单位:points, pixels等单位 。   ★使用 points(点):     td { fon... 阅读全文>>
  •     先看一个简单的例子:以下是常见按钮,使用“类”控制字体的按钮是不是漂亮了许多?而没有使用“类”控制的按钮的字体看上去就有点变形?本例使用9pt大小的宋体字控制的。       这是“类”的一个用途。    奥秘是这样的:    先定义一个“类---class”:<style type=text/... 阅读全文>>
  •     CSS的写法可以用以下的几种方法实现:     (1)使用Embed(嵌入样式单)排版样式:    即将CSS代码直接插入每个页面的HTML的<head>区,就象上一节看到的。使用<style>...</style>标签。例如:<style type=text/css><!--h2 { font-famil... 阅读全文>>
  •     CSS就是一种叫做样式表(stylesheet)的技术。也有的人称之为层叠样式表(Cascading Stylesheet)。     在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。    只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。 &... 阅读全文>>
  • .Alpha 通道   虽然Alpha通道不能完全实现PNG功能,但它确实能使图象和文字呈现半透明效果,甚至可以实现渐变半透明效果。 filter: Alpha(Opacity=starting opacity level, FinishOpacity=finish opacity level, Style=gradient style,startX=gradient start X position, FinishX=gradient fini... 阅读全文>>
  • 随着互联网经济的不断发展,互联网上的专业网站、公众服务网站以及企业门户的数量都在飞速的增长,各网站的信息量也呈爆炸性增长的趋势。面对这些庞大的信息量,我们对网页中每一个栏目的增删,都会是一个很复杂的过程。为了提高网页的维护更新效率,我们可以使用样式表,来仅仅改变一个文件,就能达到同时改变几百个网页的外观,而其个性化的表现未受任何损失。为了能充分用好样式表的强大性和灵活性,笔者就怎样有效使用样式表,来谈谈自己的一些心得体会。   1、在一个网页中同时调用CS... 阅读全文>>
  • 如果你能很好地应用CSS,那么你的主页将被打扮得很靓。下面就给大家介绍用CSS做出的一个鼠标单击特殊效果图。1、将下面的代码复制到你的主页中和之间。  〈STYLE〉.shadow {  FILTER: shadow(color=blue,direction=225)  }  .shadow1 {  FILTER: shadow(color=red,direction=225)  }  .shadow2 {  FILTER: shadow(color=gr... 阅读全文>>
  • 有关CSS段落缩进的语法如下:语法: text-indent: <值>允许值: <长度> | <百分比>初始值: 0文本缩进属性可以应用于块级元素(P,H1,等.),以定义该元素第一行可以接受的缩进的数量。该值必须是一个长度或一个百分比。若百分比则视上级元素的宽度而定。通用的文本缩进用法是用于段的缩进:P { text-indent: 2em } 即表示段落缩进2个字符我们可以作如下定义,并把代码放在<head&g... 阅读全文>>
  •     CSS的出现使网页制作者在对网页元素的控制方便许多,当然,有利必有弊,CSS只能对颜色、大小、距离等静态样式有效,对于要实现某些html元素的动态样式就显得有些力不从心。  有了CSS的自定义属性Expression,可以自己定义属性,自己在属性里写需要的代码,这样就可以结合CSS的特性与JS特效,实现对整体页面上相同元素的控制。是不是觉得有点不可思议?我们先拿新手们经常问的怎么消除页面上的链接虚线框为例。   通常的... 阅读全文>>
  • 请先看看以下演示中的图案文字。这可不是图片效果,而是用CSS滤镜中的Chroma() 语句做成的文本文字,其中文本的内容和图案都可以自由设定。  先介绍一下这个神奇的滤镜:Chroma() 滤镜。  语法: FILTER:Chroma( Color=#CCCCCC) ,其中“#CCCCCC”是颜色值。  作用效果:如果滤镜中的像素有颜色与设定的颜色相同,则该像素变为透明(包括图片的像素)。例如使用的语句是 FILTER:Chroma( Color=#CCC... 阅读全文>>
  • 一个长度的值由可选的正号 + 或负号 - 、接着的一个数字、还有标明单位的两个字母组成。在一个长度的值之中是没有空格的,例如,1.3 em就不是一个有效的长度的值,但1.3em就是有效的。一个为零的长度不需要两个字母的单位声明。  无论是相对值还是绝对值长度,CSS1都支持。相对值单位确定一个相对于另一长度属性的长度,因为它能更好地适应不同的媒体,所以是首选的。以下是有效的相对单位: em (em,元素的字体的高度) ex (x-height,字母 x 的... 阅读全文>>
  • CSS鼠标属性  习惯于使用 Windows 的用户对各种各样的鼠标样式一定不会陌生,当鼠标移动到不同的地方时,当鼠标需要执行不同的功能时,当系统处于不同的状态时,都会使鼠标形状发生改变。   虽然在网络上有各种各样的鼠标可供下载,图形五花八门,但是就 Windows 的默认系统来说,这些图形是固定不变的。改变鼠标的属性,简单说就是当鼠标移动到不同的元素对象上面时,让鼠标以不同的形状、图案显示。这种样式是通过改变“cursor”属性来完成的。下面的表格把鼠... 阅读全文>>
  • 一张风景图片,当鼠标在图片上面时,立即显示图片的文字说明,且有文字的地方图象变模糊了,当鼠标移开图片时,图片上的文字又消失了,图片又恢复了原样。这种效果是如何实现的呢?用dreamweaver的Behavirs 功能可以实现,我在这里介绍的是用CSS来制作,网页的源代码显得更简炼。   原理:利用CSS的属性值可动态改变的特点。   思路:定义一个HTML元素CSS属性的两种属性值,再用一个事件来触发,一旦事件发生,则改变HTML元素的属性值,从而达到预期... 阅读全文>>
  • 图片水平翻转代码:1、内部插入式在〈head〉与〈/head〉之间插入:style type = text/css〉.TurnH{filter:FlipH}/style〉然后在图片属性代码中加class=TurnH。注意:在〈head〉与〈/head〉之间插入代码中,TurnH前有一个“.”(不包括引号),请一定不要漏掉了。2、直接插入式在图片属性代码中加入:style= filter: FlipH效果如图1。图1特点:通过使用CSS的“FlipH”滤镜,... 阅读全文>>
  • 常做网页的朋友们一定都知道CSS吧,CSS是Cascading Style Sheet的缩写,通常人们都叫它“样式表”或“级联样式”。它的功能非常全面,从文字、图片、段落到整个网页各个方面都有它的强大之处,今天我们就来说说CSS中的滤镜效果。大家在做网页时,对图像处理多数都是用Photoshop等图形处理软件吧,其实在CSS中自带了许多滤镜,合理应用这些滤镜您同样可以做出以上软件所做出的效果。下面我就通过实例来看看CSS中的滤镜应用。图片雾化代码:1、内部... 阅读全文>>
  • letter-spacing  属性值:normal | <length>  初始值:normal  适用于:所有元素  继承:是  百分比值:不适用    “letter-spacing”属性定义了每一个字符之间的额外间距,该属性值必须以长度为单位,且正负值都是允许的。  例如下例:  <HTML>  <head&g... 阅读全文>>
  • 在网页中加入三维字体,可以让你的网页增色不少!本文的目的是:通过一个对照例子,让你能够轻松地在网页中实现三维字体,让你快速入门!如果你是初学者,只要一分钟,就可以学会了!若你是高手,那我只能算是班门弄斧了!演示地址:把握时间网址首页http://www.85time.com 例一: <HTML> <HEAD> <STYLE type=text/css>A { TEXT-TRANSFORM: none; TEXT-DECO... 阅读全文>>
  • 4、Glow 滤镜   语法:{filter:glow(color=属性值1,strength=属性值2);}   作用:该滤镜能够在原对象周围产生一种类似发光的效果,其具体效果是由小括号中的各属性名及其对应的属性值来产生的。  参数:COLOR属性是指定发光的颜色。   STRENGTH则是发光强度的表现,也指光晕的厚度;其大小可以从1到255之间的任何整数来指定这个强度。   实例: <html> <head> <meta... 阅读全文>>
  • 使用样式表的人,都会对滤镜产生深刻的印象。这是因为我们在编写网页的时候,即使我们不用图片,通过样式表滤镜,只需简单的操作,也同样可以使我们的文字,图片或者按钮鲜艳无比,充满生气,从而增强了自己网页的视觉效果。也许正是那些光怪陆离的滤镜,激发了许多人的兴趣和热情,样式表也因此赢得了众多网页制作者的青睐。那么,滤镜是什么呢?简单的说吧,它们是一些程序,能够对对象进行复杂的计算,获得常规操作难以实现的“专业”效果。   从IE 4.0版开始,浏览器就提供了一些内... 阅读全文>>
  • 访问过 Microsoft 中文主页的很多人都不会忘记它新奇的下拉式菜单吧. 它的确给我们带来一股清新的网风, 它实现了网页上下拉菜单, 不仅剩去了很多点击的麻烦, 并开创了一个网页设计的未来之路.    我们知道, 通过 CSS 可以确切地定义一个 HTML 元素的样式,包括它的颜色、字体、边框、3D效果、滤镜等等,我们在考虑制作下拉菜... 阅读全文>>
  • 经常有朋友问:如何使有超级连接的文字不出现下划线,如何使鼠标移动到超连上产生变色的效果?其实这些通过传统的方法是办不到的。而使用CSS的控制却可以非常轻松地作到,而且,页面的代码也不会臃肿。 ★★先看看超连没有下划线的例子: 例子1: 这个连接可以去页面底部,但是没有下划线。 是如何作到这一点的呢?在<head>和</head>之间加上如下的CSS语法控制: <style type=text/css>... 阅读全文>>
  •   自W3C公布了样式单(CSS)的标准以来,HTML的每一部分开始以元素的形式出现,并且事件开始真正被引入页面,动态HTML成为了人们讨论的热点。实际上,W3C采用的标准即为微软的DOM,也就是说IE4.0可以更好的支持CSS,并且微软对CSS还进行了许多十分有益地探索,Filter就是一个很好的例子。    众所周知,Javascript或Vbscript作为脚本语言,其功能是不完善的,有许多高级语言的功能无法实现,如图象的处理功能... 阅读全文>>
549 篇教程  首页 | 上一页 | 1 2 3 4 5 6 7 8 9 | 下一页 | 尾页  30篇教程/页  转到第

巧用CSS的Border属性制…

巧用样式表,让文本框…

创建并引用样式类

巧用CSS制作可控闪烁效…

网页制作共有(10)个子栏目

平面设计共有(7)个子栏目

多媒体教程共有(9)个子栏目

程序开发共有(6)个子栏目

数据库开发共有(7)个子栏目

软件应用共有(11)个子栏目

动易网校共有(5)个子栏目