W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html> <head> <style> #frameDiv { width: 250px; height: 150px; border: 1px solid black; margin: auto; } #square1 { width: 65px; height: 65px; background: yellow; offset-position: bottom right; offset-path: ray(45deg); } #square2 { width: 65px; height: 65px; background: pink; offset-position: top right; offset-path: ray(-25deg); } #square3 { width: 65px; height: 65px; background: salmon; offset-position: bottom left; offset-path: ray(90deg); } </style> </head> <body> <h1>ray() 函数</h1> <div id="frameDiv"> <div id="square1">ray(45deg)</div> <div id="square2">ray(-25deg)</div> <div id="square3">ray(0)</div> </div> </body> </html>