• 欢迎访问web前端中文站,JavaScript,CSS3,HTML5,web前端demo
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏web前端中文站吧
CSS修改浏览器滚动条样式 自定义修改方法 代码实例介绍

CSS修改浏览器滚动条样式 自定义修改方法 代码实例介绍

今天我们介绍下关于如何通过CSS修改浏览器滚动条样式,贴出示例代码,大家可以继续往下学习。 这里的内容有一个概念:包括滑动块和滑动条导轨。很多公司的项目会用到这个效果。至少需要兼容各浏览器,熟知内核特点,实现修改设置滚动条样式。 更多精彩内容请看 web 前端中文站 http://www.lisa33xiaoq.net 可按 Ctrl + D 进行收藏 滚动……

CSS+JS的酷炫机器人舞蹈动画

CSS+JS的酷炫机器人舞蹈动画

前面介绍的《【高阶】原生 JavaScript 实现的酷炫效果 动态穿越》就是利用 canvas 实现的,今天我们继续来学习下 CSS+JS 实现的酷炫机器人舞蹈动画效果。 更多精彩内容请看 web 前端中文站 http://www.lisa33xiaoq.net 可按 Ctrl + D 进行收藏 HTML 代码 <head> <met……

web前端技能考核内容及岗位要求 送给找工作的童鞋 详细概括

web前端技能考核内容及岗位要求 送给找工作的童鞋 详细概括

在找工作的过程中,多多少少都会涉及到个人能力水平,技术技能水平等级。为了应大家的要求,web 前端中文站给大家聊一聊web 前端这块的工作要求情况。将岗位区分,从主要职责、专业技能、素质能力、特别要求共四大方面给大家介绍下。PS,当然,不同的岗位,薪资不一样,特别是工作三年后,一般会有一个质的提升! 更多精彩内容请看 web 前端中文站 http://www……

CSS3 icon图标集合 使用教程

CSS3 icon图标集合 使用教程

在前端开发中,不免会结合CSS3,使用 icon图标,因为使用一些 js、css 插件脚本,会让我们的产品更显高大上。 更多精彩内容请看 web 前端中文站 http://www.lisa33xiaoq.net 可按 Ctrl + D 进行收藏 这些图标包括分享社交图标、旋转图标、悬停图标、表情图标等等。 这套icon的CSS3图标 GUI,特别适用于移动应……

CSS实现图片遮罩效果  百度爱玩效果

CSS实现图片遮罩效果 百度爱玩效果

最近自己用 css 来实现一个图片遮罩层的效果,看着不错,给大家分享下。关于遮罩层,可以用 JavaScript 实现,也可以用 css 来实现,主要还是看应用场景吧。具体效果如下:   下面贴下 html 的主要代码,css 代码太长,大家可以下载下来实践下。 <a href="#" class="mp-game-link" targe……

CSS3实现3D翻牌酷炫效果

CSS3实现3D翻牌酷炫效果

最近一直在学 css3,发现它实现效果之强大。现在的 css3 已经不在是以前的 css 了,它能做出的功能效果是我们没法想象的了。它可以实现 flash,可以制作一些 js 能做出来的效果,还可以写出 ps 做出来的一些渐变啊圆角啊阴影啊什么的效果,如此之炫的它,我相信已经有很多人对它做了更深的研究了吧。 今天我也在小小的研究了下它,主要是关于它的一些 3……

CSS巧妙实现分隔线的N种方法 实用 全面

CSS巧妙实现分隔线的N种方法 实用 全面

近期在博客突然看到类似分隔线的提示,于是自己实践了下几种方法。总结到下面 N 种简单实现分隔线的方法,大家各取所需,或者提供其他好的方法。欢迎评论留意哈 单个标签实现分隔线: .demo_line_01{ padding: 0 20px 0; margin: 20px 0; line-height: 1px; bord……

IE的CSS hack 全面 实用 文档资料查阅

IE的CSS hack 全面 实用 文档资料查阅

<span class="pun">.</span><span class="pln">all IE</span><span class="pun">{</span><span class="pln"&……

字体变体font-variation-*

字体变体font-variation-*

今天在Twitter看到Codepen上的一个示例,感觉很神奇。刚开始以为是用了什么黑科技,但仔细一看是纯CSS实现的一个效果。示例中最关键的是使用了font-variation-settings属性。那么这个属性有什么神奇之处呢?容当后述。 ……

CSS Grid和Flexbox解决实际的布局问题

CSS Grid和Flexbox解决实际的布局问题

就目前为止,CSS的Grid和Flexbox结合将是解决布局的最佳方案。虽然浏览器对CSS Grid和Flexbox的属性未完全支持,但对于实现布局而言,这已是一种非常完美的结合。如果CSS Box Alignment Module Level3能得到更好的支持的话,那么对于Web的布局将是一种福音。 ……

CSS3实现打乒乓球游戏动画效果 demo教程

CSS3实现打乒乓球游戏动画效果 demo教程

网上有很多关于 CSS3 的动画教程,只要大家学会了最基本的动画知识,任何有难度的动画效果都可以轻松的实现。今天为大家分享一款简易的打乒乓球动画。 ……

Hexi Flexi Grid Layout

Hexi Flexi Grid Layout

在《Sass绘制多边形》和《使用Sass制作菱形网格布局》文章中,我们了解了怎么通过Sass来实现多边形和菱形相关的网格布局,但这些在实际的布局中使用场景并不常见。最近@vmcreative的Hexi Flexi Grid让我感到CSS Grid布局更强大的一面。而这种布局在实际的布局也可以一用。今天把这个仓库中的功能集成了SassMagic中。那么简单的花……

灵活的overflow

灵活的overflow

说到overflow对于CSSer而言并不会陌生,用来控制内容溢出的现象。而很多时候我们还会使用text-overflow来控制内容溢出的显示。一般是直接截取,另一种是截取之后让文本后面带有三个点的省略号。不过有意思的是,我们今天要说的灵活overflow。 ……