css
-
详细介绍使用纯CSS实现自适应正方形的案例
在处理移动端页面时，我们有时会需要将 banner 图做成与屏幕等宽的正方形以获得最佳的体验效果，如 flipbord 的移动页面： 那么应该怎么使用纯 CSS 制作出能够自适应大小的正方形呢？ 方案一：CSS3 vw 单位 CSS3 中新增了一组相对于可视区域百分比的长度单位 vw, vh, vm…
-
使用CSS自定义radio、checkbox样式的示例详解
以前做自定义样式的radio, checkbox 的时候，一直是如下结构 文字 然后定义diyRadio 的样式作为新Radio, 再用js 做关联。 知道今天才知道可以用标签的for 属性 + :checked 做，纯CSS（ 真是太不应该了，学东西还是要认真、细致点。 ） DIY 单选项示例如下…
-
CSS实现Footer置底的五种方式的分享
页脚置底（sticky footer）就是让网页的footer部分始终在浏览器窗口的底部。 当网页内容足够长以至超出浏览器可视高度时，页脚会随着内容被推到网页底部；但如果网页内容不够长，置底的页脚就会保持在浏览器窗口底部。 方法一：将内容部分的margin-bottom设为负数 footer htm…
-
整合20个CSS/CSS3常用属性
这里我总结了一下平时自己在项目中经常用到的20个css常用的样式，都是些个人的经验，这里分享给大家，希望对大家有所帮助 1.强制文本单行显示：white-space:nowrap; 2.设置溢出文本显示为省略标记：text-overflow:ellipsis;(注：text-overflow:cli…
-
用css实现文本超链文字右边加一个箭头图标
许多知名网站都在文字链的右边加一个箭头图标，例如google站长管理后台，alexa官网等，这样设计的好处是让链接更醒目，更容易辨认。 文字链右边加一个箭头图标的方法，多数人是使用css背景图来实现，包括上面提到的Google站长管理后台，Alexa官网等。是的，这种方法最容易掌握和应用。这正是本文…
-
用CSS实现背景图片透明而文字不透明的两种方法
这篇文章主要介绍了css实现背景图片透明而文字不透明效果的两种方法,需要的朋友可以参考下 摘要: 方法一(毛玻璃效果)：背景图 + 伪类 + flite:blur(3px) 方法二(半透明效果)：背景图 + 定位 + background:rgba(255,255,255,0.3) CSS实现背景图…
-
css实现元素水平垂直居中常见的两种方式实例详解
这篇文章主要给大家介绍了css实现元素水平垂直居中的两种方式，文中给出了完整的示例代码供大家参考学习，对大家的学习或者工作具有一定的参考价值，有需要的朋友们下面来一起看看吧。 一、父元素的flex布局实现元素的水平垂直居中 示例代码如下： Document .parent{ display:flex…
-
必须了解的css中出现的bug以及修复方法
与许多编程语言相比，css是一种相当容易学习的语言。它的语法简单明了，而且由于它的表现本质，开发人员并不需要处理复杂的逻辑。但是，当在不同的浏览器中测试代码时，困难就会随之出现。浏览器bug何不一至的显示方式是大多css开发人员面临的主要难题。你的设计在一种浏览器上显示的很好，但在另一种浏览器上布局…
-
什么是css sprite？对css sprite技巧总结
css sprite做为一个前端人员来说必须要掌握，但是这个对于刚学习的同学来说是由困难的，下面我就专门为这个内容做一次分享，这里没有网络图片地址，若内容显示不全面你可以到我的个人博客中去查看 CSS Sprites在国内很多人叫css精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所…
-
CSS中margin边界叠加问题的解决方法介绍（图文）
本文主要介绍了css中margin边界叠加问题及解决方案。具有很好的参考价值。下面跟着小编一起来看下吧 CSS的margin边界叠加深度剖析 边界叠加简介 边界叠加是一个相当简单的概念。但是，在实践中对网页进行布局时，它会造成许多混淆。简单地说，当两个垂直边界相遇时，它们将形成一个边界。这个边界的高…
