css选择器,CSS教程 CSS选择器
点评：上节课我们讲了一下CSS通过什么方式去控制页面，如果不记得，我来帮大家回忆一下，总共有四种方式行内方式、内嵌方式、链接方式、导入方式上节课我们讲了一下CSS通过什么方式去控制页面，如果不记得，我来帮大家回忆一下，总共有四种方式行内方式、内嵌方式、链接方式、导入方式，大家通过这四种方式就可以实现CSS对HTML页面样式的控制，如果要让这些样式对HTML页面中的元素实现一对一，一对多或者多对一的... [阅读全文]
css限制字数,CSS 超出隐藏实现限制字数的功能代码（多浏览器）
点评：用时候为了有搜索引擎更喜欢网站，限制字数截取标题都是好办法。一般用超出隐藏，以免影响了整体布局。下面是多种浏览器下的写法。CSS限制字数 复制代码代码如下:... [阅读全文]
css选择器,CSS 选择器命名规范化
点评：关于CSS命名法，和其他的程序命名差不多，也是有三种：骆驼命名法，帕斯卡命名法，匈牙利命名法。规范的命名也是Web标准中的重要一项，标准的命名可以更好的看懂代码，我想大家应该都有这种经历，某日翻出自己过去写的代码居然看不懂了，呵呵，为了避免这种情况我们就要规范化命名，再说了，现在一个项目不是一个人就可以完成的，是需要大家互相合作的，如果没有规范化命名，别人就无法看懂你的代码，大大降低了工作效... [阅读全文]
网页默认字体,网页制作 默认Web字体样式
点评：通常用户看到的页面的样式会受到三层控制，第一层是浏览器的默认样式，第二层是网页定义样式，第三层是用户自定义样式。通常用户看到的页面的样式会受到三层控制，第一层是浏览器的默认样式，第二层是网页定义样式，第三层是用户自定义样式。和CSS一样，后面的优先级高于前面的，也就是说网页定义样式可以覆盖浏览器的默认样式，而用户自定义样式优先级最高。实际情况是虽然浏览器都或多或少提供了用户自定义样式的功能，... [阅读全文]
css盒子模型,CSS 理解盒子模型
点评：盒子模型，是XHTML+CSS布局页面中的核心！要想学会用CSS布局页面，就首先要理解盒子模型！什么是盒子模型？对于初学者来说，很难说出来，但是对于生活中的盒子大家熟悉吧，哈哈，这里提到的盒子模型你就可以理解成现实生活中的盒子就可以了，不然怎么能起个名字叫“盒子模型”呢好！既然和现实生活中的盒子一样，那我们想一下，生活中的盒子内部是不是空的好用来存放东西，而里面存放东... [阅读全文]
css垂直对齐,css 非表格垂直对齐效果代码
点评：非表格，一般就是指Div了。在表格中垂直居中很简单，非表格呢，可以用两种方法。第一：相对定位和绝对定位 以下是一固定宽高的Div的垂直居中代码 复制代码代码如下:... [阅读全文]
css鼠标样式,css cursor 的可选值(鼠标的各种样式)
点评：style.cursor 的可选值（鼠标的各种样式） crosshair; 十字准心 The cursor render as a crosshair游标表现为十字准线 cursor: pointer; cursor: hand;写两个是为了照顾IE5，它只认hand。 手 The cursor render as a pointer (a hand) tha... [阅读全文]
IE6，IE7下实现white-space:pre-wrap
点评：我们知道，在默认情况下，HTML 源码中的空白符均被显示为空格，并且连续的多个空白符会被视为一个，或者说，连续的多个空白符会被合并。HTML 的空白符处理规则HTML 中的“空白符”包括空格 (space)、制表符 (tab)、换行符 (CR/LF) 三种。我们知道，在默认情况下，HTML 源码中的空白符均被显示为空格，并且连续的多个空白符会被视为一个，或者说，连续的多个空白符会被合并。然而... [阅读全文]
设计黄金分割,Web设计中的黄金分割分析
点评：数学是优美的. 听上去有点奇怪? 当我第一次开始设计作品的时候，我确信如此。数学如此刻板乏味。你可能会惊讶的发现，最美观的设计，艺术作品，物体，甚至我们人都有数学上的共同点。尤其是黄金分割，也被称为神之比例，希腊字母表示其为 Φ (phi). 本教程会剖析一个网站的布局，以及如何对其黄金分割。 网页结构这些是web页面的主要元素。有很多不同的方法去组织它们，但是这种布局也许是最常用的... [阅读全文]
css圆角输入框,CSS 圆角框进行JS封装版
点评：本来前三篇文章已经将CSS圆角框讲解完毕，但从网友反馈中，都说到不好使用，因此有了这篇文章，本文主要是将前面的结果总结修订后进行JS封装，方便调用。前序：本来前三篇文章已经将CSS圆角框讲解完毕，但从网友反馈中，都说到不好使用，因此有了这篇文章，本文主要是将前面的结果总结修订后进行JS封装，方便调用。在本次封装中，增加了对真正img标签引用的图片实现圆角化，之前的圆角图片大多是基于背景图片的... [阅读全文]
css书写规范,Mozilla建议的css书写顺序
点评：css书写顺序，据网上说这个是Mozilla建议的，让你的代码兼容性更好。显示属性 复制代码代码如下:... [阅读全文]
链接rel,基于链接关系的微格式 使用rel属性
点评：我热爱语义、结构、简单和他的潜力。我决定我必须要跟世界一起分享我对他的热爱（或者至少分享给我的四个读者），要分享我是如何在博客上使用不同的微格式的。原文链接：http://www.ablognotlimited.com/articles/getting-semantic-with-microformats-part-1-rel/这篇文章作为第一篇介绍会主要集中在基于链接关系的微格式，使用re... [阅读全文]
css命名规范,css 微格式 XFN规范
点评：在这个系列文章的第一部分中，我解释了rel微格式的不同实现。在解释rel-me微格式的时候，简要的提到了XFN微格式。现在，我们花费一点时间来好好看看这个非常酷的微格式。在链接中放入个人信息由GMPG──全球媒体协议组──拟定的XHTML好友网络是一个非常简单却强大的去中心化描述方式，通过使用链接(a)的rel属性来展现人际关系。这个概念同我在第一部分中描述的基于链接的关系是一致的：a hr... [阅读全文]
css下拉菜单,简单的CSS 下拉导航菜单实现代码
点评：这个教程会告诉你如何创建一个简单的CSS下拉菜单.如果你觉得好就请告诉你的一个朋友让他也知道这个网站。效果图: 首先,我们来给这个下拉菜单写一个HTML的代码.先创建一个div来做为容器,然后把这个导航菜单放到这个内器里.正如下面的代码,我们用无序列表来创建这个导航菜单.在这个导航菜单中Portfolio项下有一个子菜单,我用粗体表示出来,最后说一句别忘了关闭/li(可以看这个:css技巧-... [阅读全文]
float居中,Float 菜单水平居中简单方法
点评：昨天用ucweb看到了goos发的一篇帖子：谁说Float菜单不可以水平居中，进去看了看，觉得方法有点繁琐了，用到了负边距，position:relativel; 和很少的一点hack。我这里还有更简单的办法，先展示： 其实我外面应该再套一个div，但为了减少碳排放，舍弃。
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E... [阅读全文]
网页常用字体,网页设计中常用的19个Web安全字体
点评：在Web编码中，CSS默认应用的Web字体是有限的，虽然在新版本的CSS3，我们可以通过新增的@font-face属性来引入特殊的浏览器加载字体。但多数情况下，考虑各个因素的影响我们还是在尽量充分利用这些默认调用的字体实现CSS的编写，这里整理了19个Web安全字体，让你无需任何顾虑的情况下畅快使用。1, Arial 微软公司的网页核心字体之一，最常用的sans serif字体，当字号很小... [阅读全文]
3d和值速查表,网页设计中的中国传统色彩速查表 颜色值
点评：一直希望自己对Web设计的色彩把握的更好些，所以手头上就备了一份图片版的配色表，对色彩的搭配有了很多的提高，今天发现了这套非常完整的Web版设计色彩速查表，相比图片版的来说就更容易实时学习了。原文作者：青女 附注及色样添加：Quester████ 粉红(#ffb3a7)，即浅红色。别称：妃色 杨妃色 湘妃色 妃红色 ████ 妃色 妃红色(#ed5736)：古同“绯”... [阅读全文]
语义学的主要内容,为网页内容添加结构和语义的hAtom微格式
点评：我们这次来讨论hAtom微格式，这个微格式用来为网页内容添加结构和语义从而使得网页内容或者局部内容可以被广播（syndication），比如博客日志或者新闻文章等。来回顾一下我们之前讨论过的微格式：rel-系列， XFN，hCard 和 hCalendar。 我们这次来讨论hAtom微格式，这个微格式用来为网页内容添加结构和语义从而使得网页内容或者局部内容可以被广播（syndication）... [阅读全文]
css清除浮动,css 清除浮动的新方法
点评：CSS 浮动清除的新方法，一般大家用空的div设置下clear 高度超出隐藏即可，下面的方法也非常值得参考下。起源： 复制代码代码如下:... [阅读全文]
css字体单位,CSS 字体单位em简介
点评：国外人士非常重视网站的易用性，相当一部分外国站点已经使用em作为字体单位.刚学网页制作的时候，老师曾经告诉我必须用CSS强制定义字体大小，否则保证每个人都看到一致的效果。这一点在现在的中国站点尤为明显。包括网易、搜狐这些门户网站在内的大部分站点，用的都是绝对单位px（像素）。但是，如果从网站易用性方面考虑，字体大小应该是可变的，一些视力不是那么好的人需要放大字体才能看得清页面内容。然而，占据... [阅读全文]
css技巧,CSS下10个节约开发时间的技巧
点评：CSS已经成为网页前段设计一个非常重要的部分，由于写CSS时需要考虑的问题非常多，老手们创建新页面是通常会沿用以前的CSS框架。但是新手没有自己的框架，这篇文章可以给新手们一些启示。1.简单的纯CSS Tooltip通过这些代码，你可以做出简单的Tooltip。这是CSS代码：复制代码代码如下:... [阅读全文]
css导航栏,css 等宽导航栏设计技巧
点评：随着宽屏显示器的流行，越来越多的网站采用了动态宽度的设计，以求页面在宽屏显示器上保持美观（960px的网页在23寸的显示器上只有半个屏幕的宽度）。动态宽度的框架设计比较复杂，今天只说说和屏幕等宽的导航栏的设计。等宽导航栏(我不知道这个名称合不合适，知道的朋友指点一下)的设计一般要遵守以下两个要素： 1.导航栏的背景和页面的最大宽度相等； 2.导航的内容的位置在页面主框架以内（导航的内容在主框... [阅读全文]
语义结构,网页简历结构和语义信息 hResume微格式
点评：现在，我们来讨论hResume微格式，他通常被用来为网页内容中的简历添加结构和语义信息。在两个月前开始了这个系列。我希望能够通过讲述我如何实现他们的细节来传播我对微格式的热爱，鼓励更多的人来支持他。到现在为止，我们已经讨论了： 基于链接关系的微格式:使用rel属性 为网页添加hCard微格式 非常酷的微格式：XFN规范 为网页内容添加结构和语义的hAtom微格式 现在，我们来讨论hResum... [阅读全文]
css实例教程,CSS reflow实例教程
点评：在CSS规范中有一个渲染对象的概念，通常用一个盒子（box, rectangle）来表示。mozilla通过一个叫frame的对象对盒子进行操作。frame主要的动作有三个： * 构造frame, 以建立对象树（DOM树） * reflow, 以确定对象位置，或者是调用mozilla的Layout（这里是指源码的实现） * 绘制，以便对象能显示在屏幕上 总的来说，reflow就是载入内容树（... [阅读全文]
css3动画,需要知道的CSS3动画技术
点评：本文译自Smashingmagazine，但是原文讲述的内容有些浅，也不是很完整，前端观察在翻译的前提下，增加了更多的更系统的内容。如有不足之处，欢迎指正补充。译自：你需要知道的CSS3 动画技术译自：What You Need To Know About Behavioral CSS请尊重版权，转载须注明本站链接！ 译序：本文译自Smashingmagazine，但是原文讲述的内容有些浅，... [阅读全文]
事件报告格式,hCalendar微格式 关于事件和基于时间或地点的活
点评：今天让我们一起来探讨一下hCalendar微格式，通过该微格式我可以为那些关于事件和基于时间或地点的活动提供语义和结构化信息。我们又来了，兴奋的冲进微格式的世界～～根据我的计划，这篇文章应该到达此系列的半程了。到这里，我已经讨论了三种微格式的实现： 在第一部分中，使用rel来定义基于链接的关系 在第二部分中，使用XFN微格式为链接增加人际关系的描述 在第三部分中，使用hCard微格式来描述人... [阅读全文]
日历表制作,CSS 制作有弹性的日历表
点评：css教程-如何用纯CSS打造一个日历.传统的日历是在一张页面划分出几个格子.作为一个网页设计师,你有权利用表格来做出效果,我也不会说你错了. 那么做为一个标准的WEB设计师来说,遵守WEB的标准好处是不言而语的.那么我们来看下如何使用CSS来做出一个有弹性的日历表出来--为什么说是有弹性的,因为日历的大小可以随着浏览器自动调整. 三个有序列表(ol) 我们来回想一下日历的格式,显然一个月的... [阅读全文]
css菜单,CSS Cookbook创建水平导航菜单
点评：CSS Cookbook例子 创建水平导航菜单
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
me... [阅读全文]
css图片翻转,CSS Cookbook 创建文字导航菜单和翻转特效
点评：CSS Cookbook例子 创建文字导航菜单和翻转特效
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
he... [阅读全文]
hcard,为网页添加hCard微格式
点评：hCard 等微格式应用会令网页中的信息更加精确和丰富，并为互联网用户带来更多的便利。说到“微格式”，有人力捧，有人质疑。归根结底，我觉得还是浏览器和终端设备的支持没有跟上，没有形成一个完整的应用流程。尽管如此，Yahoo、Google 等行业巨头已经开始在各自的主流产品中应用微格式。而作为网站开发者和个人站长，你对“微格式”的应用仍在观望之中... [阅读全文]
