' guarda anche https://www.ideepercomputeredinternet.com/2014/06/creare-ombre-elemento-testo-css.html
h1 { -webkit-text-stroke-width: 3px; -webkit-text-stroke-color: black; } testo allargato con ombra h1 { -webkit-text-stroke: 1px black; color: white; text-shadow: 3px 3px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; } vari altri esempi: #heading-1{ color: white; -webkit-text-stroke: 1px #F8F8F8; text-shadow: 0px 1px 4px #23430C; } #heading-2{ color: white; -webkit-text-stroke: 1px #F8F8F8; text-shadow: 0px 2px 4px red; } #heading-3{ color: #333; -webkit-text-stroke: 1px #282828; text-shadow: 0px 4px 4px #282828; } ********************************************************************* <html> <head> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <title>test</title> <style> p {text-shadow: 2px 2px 3px #333;} h2 {text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em red;} h4, a { /*text-shadow: 2px 2px 8px black; */ text-shadow: 2px 2px 4px #777, -2px -2px 4px #777; filter:DropShadow(Color=#000000, OffX=2, OffY=5); } #heading-1{ color: white; -webkit-text-stroke: 1px #F8F8F8; text-shadow: 0px 1px 8px #23430C; } #heading-2{ color: white; -webkit-text-stroke: 1px #F8F8F8; text-shadow: 0px 2px 4px red; } #heading-3{ color: #fff; -webkit-text-stroke: 4px #282828; text-shadow: 0px 4px 4px #282828; } h1 { -webkit-text-stroke-width: 3px; -webkit-text-stroke-color: black; text-align:center; } h2 { text-shadow: 2px 2px 3px #F30, 1px 3px 5px #f00; } </style> </head> <body style="background-color: rgb(255, 255, 255);" > <h1 align="center">Prova lampeggiamento Blinker</h1> <center> <p> ATTENZIONE CAZZO MOSCIO</p> <a href="#">questo e' un collegamento </a> <h2> questo e' un h2</h2> <h1 id='heading-3' >Welcome to Kinsta 3</h1> <h1 id='heading-1' >Welcome to Kinsta 1 </h1> <h1 id='heading-2' >Welcome to Kinsta 2</h1> <h2>Welcome to Kinsta</h2> </center> </body> </html> |