<meta name=“viewport“ ......>是什么意思

 <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">

1、name属性值viewport表示视口,不仅匹配PC端,也可匹配移动端。
2、content属性值:
(1)width:可视区域的宽度,值可为数字或关键词
(2)device-width,设备屏幕的物理宽度
(3)height:同width
(4)intial-scale:页面首次被显示是可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放
(5)maximum-scale=1.0或minimum-scale=1.0表示可视区域的缩放级别,
① maximum-scale用户可将页面放大的程序
② minimum-scale用户可将页面缩小的程序
③ 1.0表示将禁止用户放大到实际尺寸之上。
(6)user-scalable:是否可对页面进行缩放,no 表示禁止缩放

  • 3
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>daohanglan</title> <style type="text/css"> nav { width: 960px; margin: 0 auto; /*定义导航宽度,水平居中*/ } nav ul { list-style: none; /*去掉列表符号*/ } nav ul li { float: left; /*水平排列*/ position: relative; /*父级元素相对定位*/ } nav ul li ul { position: absolute; /*子元素绝对定位*/ display: none; /*默认情况下不显示*/ left: 0; /*子元素相对父元素,left:0位置显示,二级菜单和上级一级菜单项左对齐*/ } nav ul li:hover ul { display: block; /*鼠标放上去,显示下拉菜单*/ } nav a:link, a:visited { /*定义菜单项样式*/ width: 191px; display: block; padding: 10px 0; text-decoration: none; background-color: #c11136; margin-right: 1px; color: #FFF; text-align: center; } nav a:hover { background-color: #F00; } </style> </head> <body> <nav> <ul> <li><a href="#">首页</a></li> <li><a href="#">电影</a> <ul> <li><a href="#">新上映</a></li> <li><a href="#">华语</a></li> <li><a href="#">欧美</a></li> <li><a href="#">日韩</a></li> <li><a href="#">电影排行榜</a></li> </ul> </li> <li><a href="#">音乐</a> <ul> <li><a href="#">新歌首播</a></li> <li><a href="#">华语</a></li> <li><a href="#">欧美</a></li> <li><a href="#">日韩</a></li> <li><a href="#">音乐排行榜</a></li> </ul> </li> <li><a href="#">科技</a> <ul> <li><a href="#">互联网</a></li> <li><a href="#">IT业界</a></li> <li><a href="#">移动互联</a></li> </ul> </li> <li><a href="#">财经</a> <ul> <li><a href="#">财经快讯</a></li> <li><a href="#">证券要闻</a></li> <li><a href="#">财经专题</a></li> </ul> </li> </ul> </nav> </body> </html>

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值