div+css实现流程图步骤介绍工序悬浮文字效果代码
代码语言:html
所属分类:布局界面
代码描述:div+css实现流程图步骤介绍工序悬浮文字效果代码
代码标签: div css 流程图 步骤 介绍 工序 悬浮 文字
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html> <head> <meta charset="utf-8"> <style> @charset "utf-8"; * { margin:0; padding:0 } body { font-family:'Microsoft YaHei'; font-size:12px; padding-top:200px; } body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote { margin:0 } table,td,tr,th { font-size:12px } li { list-style-type:none } table { margin:0 auto } img { vertical-align:top; border:0 } ol,ul { list-style:none } caption,th { text-align:left } a { text-decoration:none; color:#000 } a:hover { color:#000; text-decoration:none } .main1140 { width:1140px; margin:0 auto; overflow:hidden } .process-box { width:1140px; height:450px } .process-box ul { width:1140px } .process-box ul li { width:196px; height:196px; float:left; cursor:pointer; position:relative } .process-box ul li .kuang { position:absolute; width:196px; height:196px; -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); border:1px solid #ddd; margin-top:42px; margin-left:42px } .process-box ul li .kuang1 { top:0; left:0; z-index:1 } .process-box ul li .kuang2 { left:5px; top:0; z-index:2 } .process-box ul li .text1 { width:276px; height:276px; text-align:center; z-index:3; position:absolute; left:7px; top:2px } .proc.........完整代码请登录后点击上方下载按钮下载查看
网友评论0