黑马程序员技术交流社区

标题: web 页面设计结束 [打印本页]

---

作者: 路人丶    时间: 2018-1-14 21:51
标题: web 页面设计结束
今天web页面的学习终于结束了，下午也复习了一些mysql的基础，今天学的大部分都是了解，只要能在网上复制，粘贴就行：bootstrap:
        webcss框架,
        集合了html/css/jquery为一家
        创建响应式的页面
        响应式:适配不同的上网设备
bootstarp的入门
        1.下载bootstarp
                网站:http://www.bootcss.com/
                下载:用于生产环境的 Bootstrap
        2.导入bootstarp.css
        3.导入jquery.js
        4.导入bootstrap.js
        5.添加一个meta标签 支持移动设备
                <meta name="viewport" content="width=device-width, initial-scale=1">
        6.将所有的内容放入到布局容器中.
                Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类
                方式1:
                        <div class="container"></div>
                方式1:
                        <div class="container-fluid"></div>
注意:
        bootstrap将每一行分成12份
媒体查询:
        假如大屏幕,每行显示6个
                超大电脑,屏幕分辨率>1200                使用: col-lg-2
               
        假如屏幕小点,每行显示4个
                992<屏幕分辨率<1200                        使用: col-md-3
                       
        再小点,每行显示2个
                768<屏幕分辨率<992                        使用: col-sm-6
       
        继续小,每行显示1个       
                屏幕分辨率<768                                使用:col-xs-12

---

作者: xiongliu    时间: 2018-1-15 10:49
整个页面的截图吧!

---

作者: 陈文老师    时间: 2018-1-15 13:11
web也要好好学哟

---

作者: 1414225997    时间: 2018-1-16 10:00
继续努力

---

作者: 渝小妹    时间: 2018-1-21 17:03
期待你每天的进步   温故而知新

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2