Bootstrap定义警告框使用的是样式类alert、alert-danger等可以使用close样式类对警告框进行关闭操作。如果在警告框添加渐变样式和半径样式会让警告框的样式更加美观。下面利用一个实例说明操作如下:
-
第一步,在WebStorm创建web项目然后在项目指定目录下新建静态页面alert.html,并引入bootstrap相关的css和js文件以及jquery文件如下图所示:
-
第二步,在,<body>标签內插入三个div标签分别设置不同样式类,然后在最里层的div插入一个button按钮class样式类为close,如下图所示:
-
第三步再在button元素下方插入一个label标签,攵字内容为“警告提示框”如下图所示:
-
第四步,在jquery初始化函数内编写按钮单击事件,调用警告框的close方法如下图所示:
-
第五步,保存代码并预览该静态页面查看到一个警告框右侧有个关闭图标,如下图所示:
-
第六步设置警告框样式,使用css样式选择器控制样式添加背景渐变色和半径属性,如下图所示:
-
注意Bootstrap样式类控制警告框样式方法
-
注意使用渐变属性设置警告框样式
经验内容仅供参考如果您需解决具体问题(尤其法律、医学等领域),建议您详细咨询相关领域专业人士