HTML怎么把layer設置圓角
在WEB開發中,我們常常會使用layer插件來實現各種彈出框、提示框等效果,但是默認情況下,layer插件的邊框是方角的,不夠美觀。那么,如何讓layer插件的邊框變得圓角呢?
首先,在頁面中引入layer的CSS文件和JS文件:
<link rel="stylesheet" href="layui/css/layui.css" media="all"> <script src="layui/layui.js" charset="utf-8"></script>接著,在調用layer的時候,添加一個樣式即可:
<script> layui.use(['layer'], function () { var layer = layui.layer; layer.open({ type: 1, shadeClose: true, area: ['300px', '200px'], content: '這是一個彈出層', // 添加style樣式 style: 'border-radius: 10px;' }); }); </script>以上代碼中,通過設置style屬性,將border-radius設置為10px,即可實現layer插件的圓角顯示效果。 總結: 上述代碼只是一個簡單的示例,可以根據實際需求而作出調整。另外,需要注意的是,在使用layer插件時,要確保正確引入了該插件的CSS和JS文件,并且需要按照該插件的API文檔進行調用。