发表于: 2018-07-10 23:57:19
2 731
今天完成的事情:
1 nginx的学习
去官网http://nginx.org/下载最新的稳定版本
解压缩到文件夹
D:\nginx-1.14.0\conf
conf文件内 打开nginx.conf文件(文本编辑器就可以打开)
可以根据需要更改参数设置
(这里需要进一步学习参数的含义,以及如何更改)
参数默认设置 打开的是D:\nginx-1.14.0\html 里的index.html文件
可以将你需要打开的文件放在D:\nginx-1.14.0\html
浏览器中键入:localhost 即可打开index.html页面
同网络下的手机端,找到无限局域网适配器wlan中的ip地址,键入
(电脑IP查看ip:win+R→cmd→ipconfig→回车)即可查看index.html页面
2下拉菜单
我们可以使用任何的 HTML 元素来打开下拉菜单,如:<span>, 或 a <button> 元素。使用容器元素 (如: <div>) 来创建下拉菜单的内容,并放在任何你想放的位置上。使用 <div> 元素来包裹这些元素,并使用 CSS 来设置下拉内容的样式。
思考上拉菜单以及侧滑菜单的实现
侧滑栏使用定位fixed
利用bootstrap响应式使用工具类visible-xs visible-sm来实现pc端隐藏切换按钮; visible-lg visible-md 实现了pc端显示导航栏;visible-xs visible-sm实现手机端显示手机导航栏。使用css3 transforms属性进行div的移动,侧滑的动画效果使用的是css属性transition
3 viewpoint知识点
要把当前的viewport宽度设为ideal viewport的宽度,既可以设置 width=device-width,也可以设置 initial-scale=1,但这两者各有一个小缺陷,就是iphone、ipad以及IE 会横竖屏不分,通通以竖屏的ideal viewport宽度为准。所以,最完美的写法应该是,两者都写上去,这样就 initial-scale=1 解决了 iphone、ipad的毛病,width=device-width则解决了IE的毛病:
<meta name="viewport" content="width=device-width, initial-scale=1">
明天计划的事情:
1完成任务6,开始任务7
遇到的问题:
在完成下拉菜单的时候,样式设置出现了一些问题,师兄指点解决
收获:
Get 到下拉菜单、nginx
还有一些webstorm使用技巧
评论