第一章、基本的圆角框 原创：冰极峰 转载请注明出处 2009年11月30日10:19:34 序言：在我的文章《超圆滑圆角框的半完美解决方案》中已经总结了七种不同的圆角框解决方案，基本上总结完了目前网络上比较流行的圆角框实现方案。而在我的
转载
2009-11-30 17:40:00
113阅读
来源：http://www.ido321.com/1214.html 前两天翻译了一篇文章，关于利用css的border属性制作基本图形：http://www.ido321.com/1200.html 在此基础上。今天分享一篇文章给大家。假设利用CSS制作冒泡提示框。 先看2张效果图： CSS： /
转载
2017-04-15 08:53:00
823阅读
2评论
气泡框（或者提示框）是网页中一种很常见的元素，大多用来展示提示信息，如下图所示：拆分来看，形如这种气泡框无外乎就是一个矩形框+一个指示方向的三角形小箭头，要制作出这样的气泡框，如果解决了三角形小箭头就容易了。一种方法就
是制作这样一个三角形箭头的图片，然后定位在矩形框上。但这种解决办法在后期更改气泡框会很不方便，可能每修改一次气泡框都要重新制作一个三角形小图标。
如果我们能够直接用HTML和CSS
转载
精选
2016-01-11 11:34:24
1234阅读
不过采取这种方式， 不怎么美丽如图：html： Here is the first option The second option cges.
原创
2023-02-20 08:49:03
1201阅读
本文为 H5EDU 机构官方 HTML5培训 教程，主要介绍：CSS基础教程 —— 纯CSS开发的气泡式提示框 作为前端开发人员，我们都熟悉使用CSS来生成页面上丰富的样式，对于边框border属性来说，也是我们最熟悉不过的CSS属性，今天我们这里将介绍如何使用纯CSS来生成一个气泡式样的提示框，希望大家喜欢！在这篇文章中我们将
转载
精选
2016-07-07 15:20:29
539阅读
本文为 H5EDU 机构官方 HTML5培训 教程，主要介绍：CSS基础教程 —— 纯CSS开发的气泡式提示框 作为前端开发人员，我们都熟悉使用CSS来生成页面上丰富的样式，对于边框border属性来说，也是我们最熟悉不过的CSS属性，今天我们这里将介绍如何使用纯CSS来生成一个气泡式样的提示框，希望大家喜欢！在这篇文章中我们将
原创
2016-08-17 09:46:54
576阅读
目录1 效果2 知识点2.1 标签2.2 CSSfloat属性2.3 CSS3transition属性2.4
原创
2022-02-05 16:21:48
257阅读
目录1 效果2 知识点2.1 标签2.2 CSSfloat属性2.3 CSS3transition属性2.4 CSS3:checked选择器2.5 CSSelement+element选择器3 代码实现1 效果2 知识点2.1
原创
2021-08-27 15:00:01
199阅读
一、关于纯CSS实现气泡对话框首先，来张大图：上边这张黄黄的，大大的，圆圆的，有个小尾巴，文字内容有些YY的图片，就是使用纯CSS实现的气泡对话框效果，一点图片都没有哦。看到这里，你是不是跟我一样，有些惊叹CSS的潜力呢。关于这张图片，暂时先放到一边，下面我要讲一些与主旨相关的比较重要的，同时又很实用的一些技术。我们首先看下面这一张图片（截自人人网）：可能颜色有点淡，在左上角有个90度的尖角，于是整个形成了一个气泡对话框。现在考考你，如果你来实现这个效果，你会怎么做？//zxx:假设你已经思考了一会儿｡◕‿◕｡我想，如果您没有看本文标题，可能就想到的是做个90度等腰三角形小图片；就算您知道可以
转载
2013-08-13 15:57:00
466阅读
2评论
转载自：http://www.zhangxinxu.com/wordpress/?p=651一、关于纯CSS实现气泡对话框首先，来张大图：上边这张黄黄的，大大的，圆圆的，有个小尾巴，文字内容有些YY的图片，就是使用纯CSS实现的气泡对话框效果，一点图片都没有哦。看到这里，你是不是跟我一样，有些惊叹CSS的潜力呢。关于这张图片，暂时先放到一边，下面我要讲一些与主旨相关的比较重要的，同时又很实用的一些
转载
精选
2014-07-23 10:11:05
495阅读
30行代码实现纯CSS—3种换肤老规矩，先把代码给大家，拿去粘贴直接用，无需引用，不
原创
2022-08-23 10:50:38
139阅读
一、关于纯CSS实现气泡对话框 首先，来张大图： 上边这张黄黄的，大大的，圆圆的，有个小尾巴，文字内容有些YY的图片，就是使用纯CSS实现的气泡对话框效果，一点图片都没有哦。看到这里，你是不是跟我一样，有些惊叹CSS的潜力呢。关于这张图片，暂时先放到一边，下面我要讲一些与主旨相关的比较重要的，同时又 ...
转载
2021-09-13 14:06:00
568阅读
2评论
流传很广的一个例子。<style type="text/css">div.roundedcorner{background: #3a6ea5; width: 200px; color:white}b.r {display:block;background: #fff}b.r b {display:block;height: 1px;overflow: hidde
转载
2009-09-29 15:42:42
567阅读
如果能避免使用JavaScript就实现DOM元素动画效果,那我非常乐于不用JS去实现。 因为更高效，而且不需要JS框架来一步步处理，代码更美观优雅。 用纯CSS来实现很难确定的一个特效是 上下滑动——当向上滑的时候内容渐变隐藏，向下滑动内容渐变显示。 之所以难以实现的原因是你可能不能获得内容的高度。 在经历了多种多样的CSS属性之后，我发现了一种利用纯CSS来实现滑动特效的方法。HTML部分
转载
2013-08-27 19:17:00
2111阅读
2评论
原文地址: CSS Triangles 演示地址：CSS Triangles Demo 原文日期: 2013年8月5日翻译日期: 2013年8月9日本文两种实现方式: 使用或不使用 before 和 :after 伪元素(伪类,pseudo-elements)最近重新设计了我的网站，准备添加tooltips提示信息效果.实现很容易，但我想要让提示功能具有三角形的指
原创
2022-02-16 15:05:16
966阅读
纯CSS圆角效果
纯CSS圆角效果
纯CSS圆角效果
1 <html> 2 <head> 3 <title>纯CSS圆角效果</title> 4 <meta http-equiv="content-type" content="text/html; charset=gb2312"> 5 <
转载
2010-04-09 09:26:00
241阅读
2评论
纯css 瀑布流 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" co ...
转载
2021-10-19 16:34:00
541阅读
2评论
做一个星级评价的功能不是很难，但是要单纯用CSS写估计就有点难度了，先来个截图： 效果很简单，可能现在您现在脑子里已经有实现的思路了。下面先看一下我们通常情况下的实现方法：CSS： 以下为引用的内容： .jsstar &nb
转载
2022-11-28 16:31:28
76阅读
感谢印记中文的 QC-L[1] 对本文进行，英文原文: English Version[2]。在 重新构想原子化 CSS中，我提到了 UnoCSS[4] 的一个预设，它提供了在纯 C...
转载
2021-11-22 16:53:28
460阅读
什么是Tootips? 这就是Tooltips如你所见，这些附加的说明文字在鼠标经过的时候显示。 当然,支持HTML.如: .<html> <head> </head> <style type="text/css"> /*Tooltips*/ .tooltips{ position:relative; /*这个是关键*/ z-index:2; } ....
转载
2009-05-25 10:03:00
107阅读
2评论
