CSS图形形状大全
The Shapes of CSS
All of the below use only a single HTML element. Any kind of CSS goes, as long as it's supported in at least one browser.
Square
Rectangle
Circle
Oval
Triangle Up
Triangle Down
Triangle Left
Triangle Right
Triangle Top Left
Triangle Top Right
Triangle Bottom Left
Triangle Bottom Right
Curved Tail Arrow via Ando Razafimandimby
Trapezoid
Parallelogram
Star (6-points)
Star (5-points) via Kit MacAllister
Pentagon
Hexagon
Octagon
Heart via Nicolas Gallagher
Infinity via Nicolas Gallagher
Diamond Square via Joseph Silber
Diamond Shield via Joseph Silber
Diamond Narrow via Joseph Silber
Cut Diamond via Alexander Futekov
Egg
Pac-Man
Talk Bubble
12 Point Burst via Alan Johnson
8 Point Burst via Alan Johnson
Yin Yang via Alexander Futekov
Badge Ribbon via Catalin Rosu
Space Invader via Vlad Zinculescu
TV Screen
Chevron via Anthony Ticknor
Magnifying Glass
Facebook Icon via Nathan Swartz
Moon via Omid Rasouli
Flag via Zoe Rooney
Cone via Omid Rasouli
Cross via Kaya Basharan
Base via Josh Rodgers
引:https://css-tricks.com/examples/ShapesOfCSS/
CSS图形形状大全的更多相关文章
- CSS样式整理大全
转载自:http://www.cnblogs.com/laihuayan/archive/2012/07/27/2611111.html 字体属性:(font) 大小 {font-size: x-la ...
- 奇妙的 CSS shapes(CSS图形)
CSS 发展到今天已经越来越强大了.其语法的日新月异,让很多以前完成不了的事情,现在可以非常轻松的做到.今天就向大家介绍几个比较新的强大的 CSS 功能: clip-path shape-outsid ...
- 奇妙的 CSS shapes(CSS图形) 【css 图形,绘图,CSS 几何图形)】
http://www.cnblogs.com/coco1s/p/6992177.html <!DOCTYPE html> <html> <head> <met ...
- 利用噪声构建美妙的 CSS 图形
在平时,我非常喜欢利用 CSS 去构建一些有意思的图形. 我们首先来看一个简单的例子.首先,假设我们实现一个 10x10 的格子: 此时,我们可以利用一些随机效果,优化这个图案.譬如,我们给它随机添加 ...
- css清除浮动大全共8种方法
原文链接http://www.jb51.net/css/173023.html 清除浮动是每一个 web前台设计师必须掌握的机能.css清除浮动大全,共8种方法. 浮动会使当前标签产生向上浮的效果,同 ...
- 【2016年特别福利】史上最全CSS学习资料大全
css学习篇 [2016年特别福利]史上最全CSS学习资料大全
- CSS颜色代码大全
CSS颜色代码大全 转载:http://blog.163.com/wujinhongisme@126/blog/static/3613698020095115919389/ RGB ( Red,Gre ...
- 美丽的CSS图形和HTML5
1.HTML5基础 文档类型 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "htt ...
- HTML标签的命名/CSS标准化命名大全
在一个内容较多的HTML页面中,需要设计许多不同的框架,再为这些不同的框架及内容进行分类,给予相应的名称,从而使得网页结构更加清晰,也为工作提供了方便.许多新手朋友在设计一个HTML文件时,可能只会依 ...
随机推荐
- 用SqlBulkCopy批量插入数据 遇到的错误
在将txt文本格式的数据导入到数据库中时候,使用的是SqlBulkCopy.但是出现了多处错误,在网上查到得资料如下: 错误一:来自数据源的 String 类型的给定值不能转换为指定目标列的类型 nv ...
- Super Mario
Super Mario Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Submit ...
- CentOS 6.5 安装Suricata(with PF_RING & CUDA)
0.基础包 确保已安装 yum install mpfr cpp ppl cloog-ppl gcc kernel-devel pcre-devel libpcap-devel yum-plugin- ...
- HDU 5170 GTY's math problem
数学题,a的b次方和c的d次方都很大,直接判断是做不出来的. 如果我们能找到一个函数F(x)是单调的,而F(X)的值又比较好算,那么可以通过比较F(X)的大小来判断自变量的大小. 令F(X)=log( ...
- opencart配置
1.安装opencart 2.修改后台目录(慎重,修改后插件安装会出错) Opencart默认的后台是网站/admin这样子,很多人可以猜到这种组合对于正式生产环境很不安全,我们可以把这个admin改 ...
- 常见的Js
//根据单独的值切换所有复选框 $("input[type='checkbox']").prop("checked", function( i, val ) { ...
- Sping--自动装配(byname, bytype)
UserDAOImpl.java: package com.bjsxt.dao.impl; import com.bjsxt.dao.UserDAO; import com.bjsxt.model.U ...
- java 生成不重复的随机数
import java.text.SimpleDateFormat;import java.util.Date; public class Test2 { public static void mai ...
- div无法跟随内容的增加而拉伸
有时将 div 的 height 设置为 auto 后,仍然无法让 div 自动拉伸,发现是 display:block 的原因,将其设置为 inline-block 即可.
- ubuntu12.04安装tar.gz格式的jdk
注意系统的版本,jdk也有32位和64位的,不然会无效 首先将*.tar.gz压缩包解压 命令: tar -xzvf *.tar.gz 假设得到的文件夹为java 将其移动到/usr/中 命令为:su ...