做问卷用哪个网站,长春市长春网站制作站优化,公司网站建设软件下载,app拉新怎么做bootstrap 的导航条标签做的很完美#xff01;我们用这个标签主要解决手机端和PC端适配的问题#xff0c;结果复制过来不能用。。
检查#xff1a;是否引入bootstrap.css js;
再重点检查有没有下面这行代码。
meta nameviewport contentwidthdevi…bootstrap 的导航条标签做的很完美我们用这个标签主要解决手机端和PC端适配的问题结果复制过来不能用。。
检查是否引入bootstrap.css js;
再重点检查有没有下面这行代码。
meta nameviewport contentwidthdevice-width, initial-scale1
下面是导航条源码
nav classnavbar navbar-defaultdiv classcontainer-fluid!-- Brand and toggle get grouped for better mobile display --div classnavbar-headerbutton typebutton classnavbar-toggle collapsed data-togglecollapse data-target#bs-example-navbar-collapse-1 aria-expandedfalsespan classsr-onlyToggle navigation/spanspan classicon-bar/spanspan classicon-bar/spanspan classicon-bar/span/buttona classnavbar-brand href#Brand/a/div!-- Collect the nav links, forms, and other content for toggling --div classcollapse navbar-collapse idbs-example-navbar-collapse-1ul classnav navbar-navli classactivea href#Link span classsr-only(current)/span/a/lilia href#Link/a/lili classdropdowna href# classdropdown-toggle data-toggledropdown rolebutton aria-haspopuptrue aria-expandedfalseDropdown span classcaret/span/aul classdropdown-menulia href#Action/a/lilia href#Another action/a/lilia href#Something else here/a/lili roleseparator classdivider/lilia href#Separated link/a/lili roleseparator classdivider/lilia href#One more separated link/a/li/ul/li/ulform classnavbar-form navbar-leftdiv classform-groupinput typetext classform-control placeholderSearch/divbutton typesubmit classbtn btn-defaultSubmit/button/formul classnav navbar-nav navbar-rightlia href#Link/a/lili classdropdowna href# classdropdown-toggle data-toggledropdown rolebutton aria-haspopuptrue aria-expandedfalseDropdown span classcaret/span/aul classdropdown-menulia href#Action/a/lilia href#Another action/a/lilia href#Something else here/a/lili roleseparator classdivider/lilia href#Separated link/a/li/ul/li/ul/div!-- /.navbar-collapse --/div!-- /.container-fluid --
/nav
viewport 指的是我们设备显示浏览器的那块区域这个说起来比较复杂我们就讲讲它的用法
containt里面的数值我们姑且把他们称作属性和值里面有6个属性和值,分别是
meta nameviewport contentwidthdevice-width, initial-scale1.0, maximum-scale1.0, user-scalable0
width: 设置的宽度为一个正整数或字符串width-device
initial-scale: 设置页面的初始缩放值为一个数字可以带小数
minimum-scale: 允许用户的最小缩放值为一个数字可以带小数
maximum-scale: 允许用户的最大缩放值为一个数字可以带小数
height: 设置layout viewport 的高度这个属性对我们并不重要很少使用
user-scalable: 是否允许用户进行缩放值为no或yes, no 代表不允许yes代表允许
补充initial-scale1 意思是缩放100%同样也能达到width device-width的效果,两者都可以用
那么如果两个都存在设备会选择哪个来显示呢答案是设备会选择最大的那个值来显示
比如:width 600 initial-scale 1 的宽度是580 那么设备会选择width 600的值
