css实现一个巨嘴鸟效果代码
代码语言:html
所属分类:布局界面
代码描述:css实现一个巨嘴鸟效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> #body { width: 10rem; height: 15rem; border-radius: 10rem 0 0 10rem; top: 0.5rem; background: #222; position: absolute; } #head1 { width: 7rem; height: 7rem; border-radius: 100%; position: absolute; top: 1rem; left: 5rem; background: #f1f1f1; } #head1 { width: 5rem; height: 5rem; border-radius: 100%; position: absolute; top: 3rem; left: 4rem; background: #f1f1f1; } #head2 { width: 5rem; height: 5rem; border-radius: 100% 0 0; position: absolute; top: 0.5rem; left: 4rem; background: #f1f1f1; } #eye { width: 0.75rem; height: 0.75rem; border-radius: 100%; position: absolute; top: 2.5rem; left: 6rem; background: #222; border: 0.25rem solid #ef8513; } #lower-beak { width: 10rem; height: 2rem; border-radius: 0 0 0 0; position: absolute; top: 3.5rem; left: 9rem; background: #ed5b12; } #upper-beak { width: 10rem; height: 3rem; border-radius: 0 7rem 0 0; position: absolute; top: 0.5rem; left: 9rem;.........完整代码请登录后点击上方下载按钮下载查看
网友评论0