乌徒帮技术范儿技术中心 › CSS样式表

CSS样式表

共有 13 篇文章

CSS实现随着字数增加而线条缩短的效果

CSS实现随着字数增加而线条缩短的效果

今天一个朋友问到我一个关于界面的问题,虽然看上去很简单,但是如果仔细思考,发现“同样一道问题,答案可以有很多不同”。废话少说,我们来看题目: 提问是:上图中,BLOG和后面的白色横线是如何做到白色横线随着前面的字数增加而缩短的。 如果不认真审题,就会觉得只需要一个简单的-margin就可以实现了。但是我们再仔细看Blog这个单词时,就会发现它的背景更整个网页的背景是连在一起的,也就是说Blog这个... 继续阅读 »

IE6/7下绝对定位层被遮住原因及其解决办法

IE6/7下绝对定位层被遮住原因及其解决办法

在网站开发中,我们经常会遇到低版本浏览器效果不如意的情况,特别是IE6/7下,很多css效果无法实现,虽然它们已经在浏览器的领域落后,但是目前市场上仍然有很多电脑上使用IE6/7,因此又不得不想办法解决这些问题。今天遇到的问题更为棘手,在IE6/7下,使用position:absolute对元素进行定位后,可能被下面的元素遮住,即使对其使用z-index属性,仍然无法避免,如下图: 在上图中,①②... 继续阅读 »

CSS长文本换行

在网页设计中,我们常常会发现文本在容器中的换行和我们理想的不一样,这导致不对齐溢出等不美观现象。那么我们怎么来控制长文本的换行呢?用CSS即可完成。 一、DIV、P等块级元素的换行控制 1、当我们定义一个区块的宽度时,文本到达宽度的时候会自动进行换行。例如: <div id="test" style="width:200px;"></div>,#test中的文本如果超过了2... 继续阅读 »

css层叠样式表二:让你的网页优雅起来

css层叠样式表二:让你的网页优雅起来

在上一讲中,我们已经初步了解了CSS的用法及CSS选择器,本文将向你讲解CSS样式的规定,通过本节的学习,你可以利用css实现网页的布局、颜色、线条、动作等样式效果。 一、CSS样式 1、css背景 属性 描述 background 简写属性,作用是将背景属性设置在一个声明中。 background-attachment 背景图像是否固定或者随着页面的其余部分滚动。 background-colo... 继续阅读 »

css实现强制不换行/自动换行/强制换行

强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{ word-break:break-all; }

div中利用css使图片垂直居中

在div中要让文字居中,只需要利用height和line-height相互配合即可实现文字垂直居中,但要让图片垂直居中,却很麻烦,要么通过高度宽度的精确计算,利用margin等属性进行位置安排,要么就看看本文的解决办法吧。

css层叠样式表一:从结构到表现,网页样式的开始

css层叠样式表一:从结构到表现,网页样式的开始

上一章中,@否子戈(新网名)简单介绍了HTML及相关知识,而本章让读者初步了解CSS层叠样式表,并可以通过自己的学习,完全放弃使用dreamweaver等可视化的网页编写工具,利用CSS快速为网页穿上漂亮的外衣。 一、初识CSS层叠样式表 什么是CSS层叠样式表?css为class的缩写,意思为样式。简单的来说,css即将网页标签的style属性与标签本身分开来,可以更为方便和统一 的规划整个网页... 继续阅读 »

10组漂亮的CSS按钮,准备好解放你的Photoshop了吗?

10组漂亮的CSS按钮,准备好解放你的Photoshop了吗?

css是web开发发展史上的惊人的发明,利用gradient, box shadow, text shadow 和 border radius这些属性,现在,我们只需要简单的HTML标签和CSS代码就能创造出漂亮的CSS按钮啦。如果我们都开始使用支持这些属性的浏览器,用几行简单的代码就能拥有CSS按钮,不再需要图片,解放你的PS吧。 我们现在还要担心的是IE浏览器不支持CSS3的问题,这回让我们担... 继续阅读 »

HTML中css和js文件链接版本号解决缓存问题

本文通过对在页面中引用的css和js文件在缓存开启情况下无法及时更新的分析,提出了三套解决方案,通过简单地修改链接形式和文件名修改,就可以在开启缓存情况下,使用新的样式和脚本

不同浏览器CSS Hack使用大全

目录:

在不同浏览器下写css是件很麻烦的事,网页设计者往往要在css hack上花费一两天的时间,本文较为全面的为读者讲解如何高效的写css hack。 一、文件结构 好的css文件结构帮助你快速解决css hack问题,在此之前,你必须明白对于同一个css样式,写在后面的样式规定将覆盖写在前面的,因此,当你想要修改某个样式,却无法从你原有的css文件中找到该样式时,你要做的是在目前已经针对某个浏览器写... 继续阅读 »