Welcome

首页 / 脚本样式 / CSS

CSS基础学习

2017-02-06 24
一．样式表基础 1． 样式表中每一个条目由选择符（selector）和对应的规则组成，选择符通常是HTML元素名称，也可以是类（class）、标识符（id）、伪类（pseudo class，它们标示了超链接的不同状态）等。 2． 将样式表（规则）添加到HTML文档中有3种方式： ① 外部样式表。 ② 应用于整个文档的样式，位于<head>区，包括嵌入样式表和输入样式表。 ③ 行内样式，通过绝大多数元素的style属性实现。 3． ...

CSS实现简单的图片防盗链代码

2017-02-06 26
实现方法很简单，在CSS中添加以下代码: img {filter:expression（this.不能去掉 ？ "" :（（！this.complete） ？ "" :this.runtimeStyle.filter = （"progid:DXImageTransform.Microsoft.AlphaImageLoader（src=""" + this.src + """）"） +String（this.不能去掉 = true）.substr（0, 0）...

130个漂亮CSS布局站点参考

2017-02-06 27
以下是CSSVault.com推荐的2004年1月--3月130个CSS布局站点，供大家参考：CCD DesignWebexpresseHappy Cog Icelandic National TeamDerek Powazek Blogdsgn Postcard TimesEview 360Euro Pair AgencySchillmaniaDFS OnlineWays to createThe Great MonkeyPapel ContinuoMa...

css技巧十条

2017-02-06 24
1.css 字体简写规则当使用css定义字体时你可能会这样做：font-size: 1em;line-height: 1.5em;font-weight: bold;font-style: italic;font-variant: small-caps;font-family: verdana,serif; 事实上你可以简写这些属性：font: 1em/1.5em bold italic small-caps verdana,serif 现在好多了吧，不过...

CSS代码缩写技巧

2017-02-06 29
Web网站可用性的关键指标是速度，更确切地说，是页面能以多快的速度出现在访问者的浏览器窗口里。影响速度的因素有很多种，包括Web服务器的速度、访问者的Internet连接情况，以及浏览器必须下载的文件大小。尽管你无法控制服务器和连接的速度，但是你可以控制构成网站Web页面的文件大小。为了让网站能够更快，Web的建设者都会按常规地压缩和优化网站上的每一个图像文件，这常常使得为了将文件的大小减少几个百分点而牺牲了图像的质量。由于CSS样式表是纯文本文件，和图像...

用CSS实现鼠标单击特效

2017-02-06 29
如果你能很好地应用CSS，那么你的主页将被打扮得很靓。下面就给大家介绍用CSS做出的一个鼠标单击特殊效果图。 1、将下面的代码复制到你的主页中和之间。〈STYLE〉.shadow { FILTER: shadow（color=blue，direction=225） } .shadow1 { FILTER: shadow（color=red，direction=225） } .shadow2 { FILTER: shadow（color=gre...

重构、标准、布局

2017-02-06 25
近来大家总是在标准上争论不休，其实，这些问题一些相关文章已经说得很明白了。 以下我就谈谈我的看法。本帖子有太多的“我认为”，说明了我只是想把我的想法拿出来跟大家商榷，或许有太多不对的地方，也请大家一一指出。 1、我对web标准的理解 所谓的web标准，在一些教程文章上已经得到结论：结构化标准（XHTML、XML）、表现标准（CSS、XSLT？）、行为标准（DOM、ECMAScript）。这些东西在网上一搜一大把，在这里我就不多说了。我只说我自己的想法...

CSS如何使DIV层居中

2017-02-06 25
如何使DIV居中主要的样式定义如下：body {TEXT-ALIGN: center;}#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; } 说明：首先在父级元素定义TEXT-ALIGN: center;这个的意思就是在父级元素内的内容居中；对于IE这样设定就已经可以了。但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: au...

对display:inline;与float:left;的认识

2017-02-06 25
首先我们要明确，display:inline;与float:left;正确含义。display:inline;（内联）《CSS权威指南》中文字显示:任何不是块级元素的可见元素都是内联元素。其表现的特性是“行布局”形式，这里的“行布局”的意思就是说其表现形式始终以行进行显示。比如，我们设定一个内联元素border-bottom:1px solid #000;时其表现是以每行进行重复，每一行下方都会有一条黑色的细线。如果是块级元素那么所显示的的黑线只会在块的下...

认识CSS中absolute与relative

2017-02-06 23
很多朋友问过我absolute与relative怎么区分，怎么用？我们都知道absolute是绝对定位，relative是相对定位，但是这个绝对与相对是什么意思呢？绝对是什么地方的绝对，相对又是相对于什么地方而言的呢？那他们又有什么样的特性，可以做出什么样的效果呢？关于两者之间又有什么样的技巧呢？下面我们就来一一解读。Absolute，CSS中的写法是：position:absolute; TOP、RIGHT、BOTTOM、LEFT（下面简称TRBL）进行...

用CSS构建iframe效果

2017-02-06 33
iframe应用很普遍，通常的需求有两种： 1，获取iframe效果，就是带一个滚动条，可以省不少版面。 2，要嵌一个页面，实现框架链接。 如果不方便使用iframe，可以有如下解决方案： 第一种需求如果我们使用CSS布局来实现，即可以少一个页面，也可以提高效率。 第二种需求可以采用xmlhttp远程获取。A.直接模拟iframe 用层做容器 复制代码 代码如下:#content{overflow:auto;height:200px;width:600px...

不用float实现模块居中布局

2017-02-06 27
最常见实用的布局形式：上、中左、中右、底四个模块，宽度760px，整体页面居中。结构代码，top left right foot 四个模块全部独立、互不嵌套。＜div id="top"＞head＜/div＞＜div id="left"＞ ＜div id="left_module"＞left＜/div＞＜/div＞＜div id="right"＞ ＜div id="right_module"＞right＜/div＞＜/div＞＜div id="foot" ＞...

引入CSS样式的五种方式

2017-02-06 31
一、使用STYLE属性将STYLE属性直接加在个别的元件标签里，<元件（标签） STYLE="性质（属性）1: 设定值1; 性质（属性）2: 设定值2; ...}例如： <TD STYLE="COLOR:BLUE; font-size:9pt; font-family:"标楷体"; line-height:150%>这种用法的优点 是可灵巧应用样式於各标签中，但是缺点则是没有整篇文件的『统一性』。二、使用STYLE标签将样式规则写在<...

利用相对定位及偏移量做精美输入界面

2017-02-06 28
利用相对定位和偏移量属性，可以很好的实现以前需要用图片才能实现的界面，而且实现起来比也很方便。例如，当需要用户输入某些信息，我们常常会用到：标题栏－内容－确定按钮 这种结构，下面是利用CSS样式的相对定位及偏移量做的输入界面。主要特点是：标题栏图片有向上的偏移量。利用样式：top:-10px;position:relative; 可以让图片脱离容器，定位于容器之外（本例子中图片的容器是class="main"的div）。但有一点需要注意的是，图片位置虽然脱...

用CSS实现文字变图象特效

2017-02-06 35
一段文字，当鼠标在文字上面单击，文字消失，原来文字的地方却立即变成了一张图片，当鼠标在图片上单击，图片又消失，原来的文字又重现了，像变魔术一样，是不是有意思？！这种效果用Dreamweaver的Behavirs 功能也可实现，但那要增加一段javascript程序，明显增加了不少代码。而用CSS来制作这种效果，增加的代码却要少得多。 原理:利用CSS的属性值可动态改变的特点。 思路:定义一个HTML元素CSS属性的两种属性值，再用一个事件来触发，一旦事...

用CSS控制的闪烁效果

2017-02-06 52
一段文本或一张图片，它的周围有一圈光晕，这圈光晕每一秒钟闪烁一次，而当鼠标移到上面时，立即停止闪烁，当鼠标移开时又继续闪烁。这种效果用于那些需要特别引起别人注意的内容上（如:警示、报告新增内容等），能起到较好的效果。 上面这个示例就能实现上面所的效果，由于这里是抓取的一张图片，不能看到动态效果，只要按下面介绍的方法，制作一个试试，其效果是一目了然的。其制作思路是:采用了CSS的“Glow”滤镜产生光晕效果，利用CSS的属性可动态改变的特性，用一小段jav...

expression将JS、Css结合起来

2017-02-06 26
IE5及其以后版本支持在CSS中使用expression，用来把CSS属性和Javas cript表达式关联起来，这里的CSS属性可以是元素固有的属性，也可以是自定义属性。就是说CSS属性后面可以是一段Javas cript表达式，CSS属性的值等于Javas cript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法，也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。 给元素固有属性赋值 例如，你可以依照浏览...

CSS做一个超链接的陷下效果

2017-02-06 25
代码如下：<style>A:link,A:visited ,A:active {TEXT-DECORATION: none}A:hover {text-decoration : none; position : relative; top : 1px; left : 1px}</style><A HREF="http://homepage.yesky.com/">把鼠标放上来看看效果---</A><A ...

兼容各个浏览器的技巧

2017-02-06 25
1,盒解释器的不同解释.#box{ width:600px; //for ie6.0- width:500px; //for ff+ie6.0}#box{ width:600px！important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-}2,在ie中隐藏css,使用子选择器html>body #box{ }3,只有ie识别*html #box{ }4,在...

块元素block element和内联元素inline element

2017-02-06 25
内联级元素（inline-level element）中试图插入块级（block-level element）元素。这样做是不允许的。唯一的能在内联元素中插入块级元素的例外是object标签。那么什么是内联级元素（inline-level element）和块级（block-level element）元素呢？。块元素（block element）一般是其他元素的容器元素，块元素一般都从新行开始，它可以容纳内联元素和其他块元素,常见块元素是段落标签""P"...
<< 1 2 3 4 5 6 7 8 9 10 >>
版权所有©石家庄振强科技有限公司2024 冀ICP备08103738号-5 网站地图