jquery+css实现自定义印章盖章效果代码

代码语言:html

所属分类:其他

代码描述:jquery+css实现自定义印章盖章效果代码

代码标签: jquery css 自定义 印章 盖章

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>.container{position:relative;}.emblem span{position:absolute;display:inline-block;left:0;right:0;top:0;bottom:0;font-size:18px;color:#37474f;font-weight:900;transition:all 0.5s cubic-bezier(0,0,0,1);}.emblem{position:absolute;left:80px;top:80px;width:240px;height:240px;border-radius:50%;color:#7D970B;text-align:center;overflow:hidden;border:5px solid red;}.rightConent{margin-left:450px;margin-top:30px;}.btns{display:flex;margin:auto;}.btns>div{border:1px solid #7D970B;border-radius:10px;padding:20px;margin:10px;}.btns>div>div{text-align:center;border:coral 2px solid;border-radius:10px;margin:10px auto;padding:8px 20px;cursor:pointer;}.btns>div>div:hover{background-color:#FFC790}.inputBox{display:flex;align-items:center;}input{outline:none;display:block;width:300px;height:40px;border:2px solid orange;border-radius:10px;color:#666;text-indent:20px;}.changeBtn{width:100px;height:40px;border-radius:8px;background:#666666;color:#ffffff;text-align:center;line-height:40px;margin-left:10px;}</style>
</head>
<body>
<div class="container">
<div id="emblem" class="emblem"></div>
</div>
<div class="rightConent">
<div class="inputBox">
<input class="company" type="text" value="" placeholder="请输入名称">
<div class="changeBtn" onclick="changeCompany()">提交变更</div>
</div>
<h2>调整角度</h2>
<div class="btns">
<div>.........完整代码请登录后点击上方下载按钮下载查看

网友评论0