css实现文字阴影海报封面效果代码
代码语言:html
所属分类:布局界面
代码描述:css实现文字阴影海报封面效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> @import url("https://fonts.googleapis.com/css?family=Anton"); *, *:before, *:after { box-sizing: border-box; margin: 0; padding: 0; } html, body { height: 100%; width: 100%; } html { font-size: 100%; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; align-items: center; background-color: #edeff5; display: flex; font-family: sans-serif; font-size: 100%; font-weight: normal; justify-content: center; overflow-x: hidden; padding: 2rem; } .poster { align-items: center; background-color: white; box-shadow: 0 2vh 5vh rgba(0, 0, 0, 0.3); display: flex; height: 80vh; justify-content: center; overflow: hidden; padding: 5vh; width: 56vh; } h1 { color: white; font-family: Anton, sans-serif; font-size: 10vh; font-weight: normal; line-height: 1; text-shadow: -1px 1px black, -1px 1px black, -2px 2px black, -3px 3px black, -4px 4px black, -5px 5px black, -6px 6px black, -7px 7px black, -8px 8px black, -9px 9px black, -10px 10px black, -11px 11px black, -12px 12px black, -13px 13px black, -14px 14px black, -15px 15px black, -16px 16px black, -17px 17px black, -18px 18px black, -19px 19px black, -20px 20px black, -21px 21px black, -22px 22px black, -23px 23px black, -24px 24px black, -25px 25px black, -26px 26px black, -27px 27px black, -28px 28px black, -29px 29px black, -30px 30px black, -31px 31px black, -32px 32px black, -33px 33px black, -34px 34px black, -35px 35px black, -36px 36px black, -37px 37px black, -38px 38px black, -39px 39px black, -40px 40px black, -41px 41px black, -42px 42px black, -43px 43px black, -44px 44px black, -45px 45px black, -46px 46px black, -47px 47px black, -48px 48px black, -49px 49px black, -50px 50px black, -51px 51px black, -52px 52px black, -53px 53px black, -54px 54px black, -55px 55px black, -56px 56px black, -57px 57px black, -58px 58px black, -59px 59px black, -60px 60px black, -61px 61px black, -62px 62px black, -63px 63px black, -64px 64px black, -65px 65px black, -66px 66px black, -67px 67px black, -68px 68px black, -69px 69px black, -70px 70px black, -71px 71px black, -72px 72px black, -73px 73px black, -74px 74px black, -75px 75px black, -76px 76px black, -77px 77px black, -78px 78px black, -79px 79px black, -80px 80px black, -81px 81.........完整代码请登录后点击上方下载按钮下载查看
网友评论0