bootstrap10-网格系统实例:手机、平板电脑、台式电脑

简介:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>bootstrap10</title>

<link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">  

</head>

<body>

<div class="container">

<h1>Hello, world!</h1>


<div class="row">

<div class="col-sm-3 col-md-6 col-lg-8" style="background-color: #dedef8; 

         box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;">

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do 

            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 

            enim ad minim veniam, quis nostrud exercitation ullamco laboris 

            nisi ut aliquip ex ea commodo consequat. 

        </p>


        <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem 

            accusantium doloremque laudantium, totam rem aperiam, eaque ipsa 

            quae ab illo inventore veritatis et quasi architecto beatae vitae 

            dicta sunt explicabo. 

        </p>

</div>


<div class="col-sm-9 col-md-6 col-lg-4" style="background-color: #dedef8;

         box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;">

          <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem 

            accusantium doloremque laudantium.

         </p>


         <p> Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, 

            consectetur, adipisci velit, sed quia non numquam eius modi 

            tempora incidunt ut labore et dolore magnam aliquam quaerat 

            voluptatem. 

        </p>

          </div>

</div>

</div>

    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>

   <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>

</body>

</html>

本文转自  素颜猪  51CTO博客,原文链接:http://blog.51cto.com/suyanzhu/1895668
相关文章
【干货】手机投屏到电脑
【干货】手机投屏到电脑
|
2月前
|
移动开发 Android开发 数据安全/隐私保护
移动应用与系统的技术演进:从开发到操作系统的全景解析随着智能手机和平板电脑的普及,移动应用(App)已成为人们日常生活中不可或缺的一部分。无论是社交、娱乐、购物还是办公,移动应用都扮演着重要的角色。而支撑这些应用运行的,正是功能强大且复杂的移动操作系统。本文将深入探讨移动应用的开发过程及其背后的操作系统机制,揭示这一领域的技术演进。
本文旨在提供关于移动应用与系统技术的全面概述,涵盖移动应用的开发生命周期、主要移动操作系统的特点以及它们之间的竞争关系。我们将探讨如何高效地开发移动应用,并分析iOS和Android两大主流操作系统的技术优势与局限。同时,本文还将讨论跨平台解决方案的兴起及其对移动开发领域的影响。通过这篇技术性文章,读者将获得对移动应用开发及操作系统深层理解的钥匙。
|
1月前
|
人工智能 自然语言处理 机器人
“今日热点:AI像人类一样使用手机和电脑”,魔搭社区的开源项目已先行一步
今天,Claude发布了Computer Use的新功能,可以让AI像人一样使用电脑!
|
1月前
|
Android开发 Swift iOS开发
python 基于电脑蓝牙连接获取手机的实时数据
python 基于电脑蓝牙连接获取手机的实时数据
54 0
|
2月前
|
自然语言处理 决策智能 Python
同时操控手机和电脑,100项任务,跨系统智能体评测基准有了
【9月更文挑战第9天】近年来,随着人工智能技术的进步,自主智能体的应用日益广泛。为解决现有评测基准的局限性,研究人员推出了CRAB(Cross-environment Agent Benchmark),这是一种支持跨环境任务的新框架,结合了基于图的精细评估方法和高效的任务构建机制。CRAB框架支持多种设备并可轻松扩展至任何具备Python接口的环境。首个跨平台基准CRAB-v0包含100项任务,实验显示GPT-4单智能体在完成率方面表现最佳。CRAB框架为智能体研究提供了新机遇,但也面临计算资源和评估准确性等方面的挑战。
71 9
|
3月前
|
存储 NoSQL Java
使用redis进行手机验证码的验证、每天只能发送三次验证码 (redis安装在虚拟机linux系统中)
该博客文章展示了如何在Linux虚拟机上使用Redis和Jedis客户端实现手机验证码的验证功能,包括验证码的生成、存储、验证以及限制每天发送次数的逻辑,并提供了测试结果截图。
使用redis进行手机验证码的验证、每天只能发送三次验证码 (redis安装在虚拟机linux系统中)
|
3月前
|
存储 数据可视化 C语言
【C语言】C语言 手机通讯录系统的设计 (源码+数据+论文)【独一无二】
【C语言】C语言 手机通讯录系统的设计 (源码+数据+论文)【独一无二】
|
5月前
|
PHP
驾校在线考试系统源码 手机+PC+平板自适应
Thinkphp在线考题源码 驾校在线考试系统 手机+PC+平板 自适应,机动车驾驶培训学校驾校类网站源码带手机端 运行环境:php+mysql
179 11
驾校在线考试系统源码 手机+PC+平板自适应
|
5月前
|
数据安全/隐私保护 SEO
蚂蚁分类信息系统二开仿么么街货源客模板微商货源网源码(带手机版)
网站采用蚂蚁分类信息系统二次开发,模板仿么么街货源客模板,微商货源网定制版。 模板设计风格简洁,分类信息采用列表形式发布,这种设计方式非常符合度娘 SEO 规则。收录效果是杠杠的。 这个网站风格目前是用来做货源推广使用的,但不仅限于货源网站。后台无加密,分类目录随意修改。 无论你是想做地方分类信息,二手市场,或者垂直行业信息分类平台都是不错的选择。
43 2
蚂蚁分类信息系统二开仿么么街货源客模板微商货源网源码(带手机版)
|
4月前
|
关系型数据库 MySQL 测试技术
基于SpringBoot+Vue华强北商城二手手机管理系统(源码+部署说明+演示视频+源码介绍+lw)(4)
基于SpringBoot+Vue华强北商城二手手机管理系统(源码+部署说明+演示视频+源码介绍+lw)
50 2

热门文章

最新文章