太阳集团tyc5997|官网【中国】有限公司

棘轮模式盒的实现
  • 作者:admin
  • 发表时间:2021-02-06 07:51
  • 来源:未知

本文主要介绍了棘轮模态盒的实现,通过实例代码详细介绍,对大家的学习或工作有一定的参考学习价值。有需要的朋友可以和边肖一起学习

模态框在任何系统的布局中都是非常重要的。其实个人觉得还是直接发个alert()比较好,只是现在很多人觉得alert()的弹出框太弱了。同时,不应在alert()中放置过多的文本。如果注册的“服务协议”等弹出窗口出现在此页面,此时可以考虑使用棘轮的模态框。

效果如下:

实现代码如下:

!' DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN '

http://www.w3.org/TR/html4/strict.dt

超文本标记语言

meta http-equiv=' Content-Type ' Content=' text/html;charset=utf-8 '

!-自适应手机屏幕-

meta name=' viewport ' content=' initial-scale=1,maximum-scale=1,user-scalable=no,minimum-ui '

!-适应苹果手机-

meta name=' apple-mobile-web-app-ability ' content=' yes '

meta name=' apple-mobile-web-app-status-bar-style ' content=' black '

!-不要被百度转码-

meta http-equiv='Cache-Control '内容='no-siteapp'/

!-引入棘轮资源-

script type=' text/JavaScript ' src=' js/ratchet . min . js '/script

link href=' CSS/ratchet . min . CSS ' rel='样式表' type='text/css '

标题模式/标题

/head

身体

div class='content '

a href=' # modal id ' class=' btnbtn-primary BTN-block '打开模式框/a

唐山网络公司

div id='Modalid' class='modal '

header class='bar bar-nav '

a class=' icon icon-close pull-right ' href=' # Modalid '/a

H1 class='title '模式框标题/h1

/header

div class='content '

P class='内容填充'模式框内容/p

/div

/div

/div

/body

/html

本文介绍了棘轮模式盒的实现。更多相关棘轮模态盒内容,请搜索Script House之前的文章或者继续浏览下面的相关文章。希望大家以后多多支持脚本屋!

Baidu
sogou