网页制作

任意一块网页内容实现“活”的背景(目前火狐浏览器专有)

有一个你们可能从未听说的有趣的CSS功能是火狐浏览器独创的-moz-element属性,使用它,你可以用网页上任意的内容作为背景,跟背景图的效果相似。HTML和CSS代码假设你的网页里有这样一块HTML内容,它有CSS样式,里面有文本信息,还有一些inline的CSS属性:复制代... 查看详情
收藏 0 赞 0 分享

使用css3实现超炫的loading加载动画效果

SpinKit 是一套网页动画效果,包含8种基于 CSS3 实现的很炫的加载动画。借助 CSS3 Animation 的强大功能来创建平滑,易于定制的动画。SpinKit 的目标不是提供一个每个浏览器都兼容的解决方案,而是给现代浏览器提供更优的技术实现方案和更佳的使用体验。(为保... 查看详情
收藏 0 赞 0 分享

项目中碰到的css兼容问题小结

1、一般主流浏览器都支持background-repeat: repeat-y;有的浏览器不支持,解决办法,用background-position 2、在table里边,如果在头部定义了寬高,在td里边colspan后,宽度失效,解决办法,在table添加样式:table-la... 查看详情
收藏 0 赞 0 分享

css行内元素padding,margin,width,height没有变化

要点: 块状元素前后元素会换行 行内元素前后元素不会换行 第一:行内元素与宽度 宽度不起作用 复制代码代码如下: span { width:200px; } 没有变化 第二:行内元素与高度 高度不起作用 复制代码代码如下: span{ height:200px; } 没用变化 第... 查看详情
收藏 0 赞 0 分享

clear:both后margin-top不起作用其他左右下都起作用

如: 复制代码代码如下: <div style="float:left;">float:left</div> <div style="clear:both;margin-top:20px;margin-bottom:20px;background: ... 查看详情
收藏 0 赞 0 分享

css及js调用方法详细汇总

css调用方法: 1. 链接样式表 同样是添加在HTML的头信息标识符<head>里 复制代码代码如下: <head> <link rel="stylesheet" type="text/css" href="style.css" /> <... 查看详情
收藏 0 赞 0 分享

设置网站二级导航及把二级导航做的好看

很多网站已经不满足于一级标题的展示,可能很多的时候有二级标题,三级标题等等。 那么如何设置二级标题以及如何把二级标题做的好看呢。 下面的代码中注意: 1.为了让二级标题有渐隐渐现的感觉,用了transition样式 2.二级标题的定位始终是一个困扰我好久的难题。 要确保一级标题有... 查看详情
收藏 0 赞 0 分享

一个不错的html视频播放器兼容主流浏览器

最近工作上的需求需要对移动客户端上发送的视频在网页上播放,and 上传视频并在网页上播放(例如上传教学视频或者动态分享等)(博主碎碎念:移动客户端上传的你不会用手机的播放器看啊,网页上上传你不会上传到youku或者youtube等各大知名网站上上传然后在自己的网站上直接引用链接啊... 查看详情
收藏 0 赞 0 分享

CSS3 Media Queries详细介绍和使用实例

Media Queries直译过来就是“媒体查询”,在我们平时的Web页面中head部分常看到这样的一段代码: 复制代码代码如下:<link href="css/reset.css" rel="stylesheet" type="text/... 查看详情
收藏 0 赞 0 分享

纯css绘制蜂巢六边形效果

纯CSS绘制的六边形复制代码代码如下:<html> <head> <title>Draw Hive</title> </head> <style type="text/css">... 查看详情
收藏 0 赞 0 分享

css实现字符串截断并加省略号示例

复制代码代码如下:<html><head><title></title></head><style>.title{width:100px;white-space:nowrap;word-break:keep-... 查看详情
收藏 0 赞 0 分享

使用css样式实现动态图片裁剪示例

使用样式实现动态图片裁剪复制代码代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml... 查看详情
收藏 0 赞 0 分享

css仿word首字下沉效果示例

css首个文字下沉效果用过word的大部分人都知道,word里有一个首字下沉功能,在文章的排版时用,有时能给文章增色不少。用css仿word的首字下沉功能,不用修改代码,只用到css的伪元素:first-letter,即可实现首字下沉效果。复制代码代码如下:<p>&l... 查看详情
收藏 0 赞 0 分享

css与html常见的三种结合方式示例介绍

复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head... 查看详情
收藏 0 赞 0 分享

css设置各种中文字体如雅黑、黑体、宋体、楷体等等

复制代码代码如下: .selector{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu } 说明: 加上中文名“微软雅黑”是为了兼容opera。 Mi... 查看详情
收藏 0 赞 0 分享

收罗CSS布局中有关水平和垂直居中的N种方法

最近开始倒回来看看CSS这块儿有什么不太了解的地方需要巩固!呵,好家伙!一番折腾之后我发现还真有很多不太了解的。真是学无止境啊...CK说网上有很大概15种可以让CSS元素居中的方法。Oh,卖糕的!这是逼我查资料到夜晚两点的节奏么? 闲话休体,现在我们来进入正题咯: 先来说说水平... 查看详情
收藏 0 赞 0 分享

利用css的样式对文本进行隐藏和显示等操作

复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head... 查看详情
收藏 0 赞 0 分享

css的border和clear属性使用方法和示例

首先,如果你曾用过table制作网页,你就应该知道,如果要在表格中绘制一条虚线该如何做,那需要制作一个很小的图片来填充,其实我们还有更简单的办法,只要在<td></td>中加入这么一段就可以了,你可以试试:复制代码代码如下:<div style="b... 查看详情
收藏 0 赞 0 分享

css3实现可滑动跳转的分页插件示例

今天我要向大家分享一款很特别的CSS3分页插件,这款分页插件不仅可以点击分页按钮来实现分页,而且可以滑动滑杆来实现任意页面的跳转,看看都非常酷,很适合一些个性化的个人网站使用,当然,这款分页插件也适合ajax翻页,效果都挺不错的。先来看看效果图:怎么样,还挺酷的吧。当然你也可以在... 查看详情
收藏 0 赞 0 分享

html、css 禁止文字自动换行属性word-break

一些时候,文字会自动换行,解决办法是用css 在这行文字的td属性中,加入 复制代码代码如下: style="word-break : break-all;" ... 查看详情
收藏 0 赞 0 分享