fcc 响应式框架Bootstrap 练习3
class="container-fluid"控制宽度100%
<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
</div>
class 属性 well
,它的作用是为设定的列创造出一种视觉上的深度感
<div class="col-xs-6 ">
<div class="well ">
</div>
</div>
class="btn btn-default"默认按钮颜色
<div class="row">
<div class="col-xs-6">
<div class="well">
<button class="btn btn-default"></button>
<button class="btn btn-default"></button>
<button class="btn btn-default"></button>
</div>
</div>
并不是每一个 class 属性都是用于 CSS 的, 有些时候我们创建一些 class 只是为了更方便地在jQuery中选中这些元素,
为每一个 button
都添加 target
class
<div class="row">
<div class="col-xs-6">
<div class="well">
<button class="btn btn-default target"></button>
<button class="btn btn-default target"></button>
<button class="btn btn-default target"></button>
</div>
</div>
给每一个按钮一个唯一的 id ,以 target1
为开始,target6
为结束
<div class="col-xs-6">
<h4>#right-well</h4>
<div class="well" id="right-well">
<button id="target4" class="btn btn-default target">#target4</button>
<button id="target5" class="btn btn-default target">#target5</button>
<button id="target6" class="btn btn-default target">#target6</button>
</div>
</div>
开始使用jQuery,将修改HTML元素,但是实际上并不是直接在 HTML 文本中修改。
必须确保让每个人都知道,他们不应该直接修改此页面上这些代码。
可以在 <!--
为开始, -->
为结束的地方进行评论注释.(像这样, <!--
我是一段注释 -->
)
fcc 响应式框架Bootstrap 练习3的更多相关文章
- fcc 响应式框架Bootstrap 练习2
text-primary 属性值使标题直接变成了红色,text-center使标题直接居中 <h2 class="text-primary text-center"> ...
- fcc 响应式框架Bootstrap 练习1
需要通过添加下列代码到你的HTML开头来将Bootstrap添加到任意应用中: <link rel="stylesheet" href="//cdn.bootcss ...
- 响应式框架Bootstrap
概念:Bootstrap将会根据你的屏幕的大小来调整HTML元素的大小 -- 强调 响应式设计的概念. 通过响应式设计,你无需再为你的网站设计一个手机版的.它在任何尺寸的屏幕上看起来都会不错. Boo ...
- 响应式框架Bootstrap栅格系统
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8&qu ...
- .NET Core的响应式框架,基于Ace Admin框架菜单导航,Bootstrap布局,fontAwesome图标,内嵌Iframe用EasyUI做数据绑定,动态配置列表,动态配置表单
netnrf 响应式框架 用于快速开发的响应式框架 演示:https://rf2.netnr.com v3.x 前端采用 jQuery + Bootstrap + EasyUI + AceAdmin ...
- 15个最好的HTML5前端响应式框架(2014)
文中的多个框架基于SASS创建,SCSS是一种比LESS更简洁的样式表编程语言,它能够编绎成CSS,可复用CSS代码,声明变量,甚至是函数,类Ruby/Python的语法.參见: LESS vs SA ...
- 一个响应式框架——agera
Google在上周开源了一个响应式框架——agera,相信它会慢慢地被广大程序员所熟知.我个人对这样的技术是很感兴趣的,在这之前也研究过RxJava,所以在得知Google开源了这样的框架之后第一时间 ...
- 美团客户端响应式框架EasyReact开源啦
前言 EasyReact 是一款基于响应式编程范式的客户端开发框架,开发者可以使用此框架轻松地解决客户端的异步问题. 目前 EasyReact 已在美团和大众点评客户端的部分业务中进行了实践,并且持续 ...
- 强大又简单的响应式框架——Foundation 网格系统
前端框架——Foundation 简介 Foundation 用于开发响应式的 HTML, CSS and JavaScript 框架. Foundation 是一个易用.强大而且 ...
随机推荐
- Linux上安装Hadoop集群(CentOS7+hadoop-2.8.0)--------hadoop环境的搭建
Linux上安装Hadoop集群(CentOS7+hadoop-2.8.0)------https://blog.csdn.net/pucao_cug/article/details/71698903 ...
- Android三角标签View:TriangleLabelView
Android三角标签View:TriangleLabelView 在一些商城.产品推销类APP中,如淘宝.京东.电影门票销售.商品降价促销这类的APP,常常会在其APP中看到,某些商品的左上角 ...
- [luoguP2158] [SDOI2008]仪仗队(数论)
传送门 可以看出 (i, j) 能被看到,(i * k, j * k) 都会被挡住 暴力 所以 gcd(i, j) == 1 的话 ans ++ 那么可以枚举一半(中轴对称),求解答案,只能拿30分 ...
- hdu 2255KM算法模板
#include<stdio.h> #include<string.h> #define N 400 #define inf 0x7fffffff int Max(int a ...
- Hibernate插入错误:GenericJDBCException: could not insert:
数据库中一般不能建立user(表名为User)表,将User类改名,又一次建立映射,问题就能够解决 当然,还有还有一种情况.就是类中id类型错误.要设置为Integer型才干够设置自己主动增长,否则也 ...
- Cisco VPP(1) 简单介绍
一.简单介绍 VPP全称Vector Packet Processing.是Cisco2002年开发的商用代码. 2016年2月11号,Linux基金会创建FD.io项目.Cisco将VPP代码的开源 ...
- android自己定义控件系列教程-----仿新版优酷评论剧集卡片滑动控件
我们先来看看优酷的控件是怎么回事? 仅仅响应最后也就是最顶部的卡片的点击事件,假设点击的不是最顶部的卡片那么就先把它放到最顶部.然后在移动到最前面来.重复如次. 知道了这几条那么我们就非常好做了. 里 ...
- ZOJ 3888 Twelves Monkeys (预处理+优先队列)
题目链接:ZOJ 3888 Twelves Monkeys 题意:题目描写叙述起来比較绕,直接讲案例 9 3 3 9 1 6 1 4 1 6 7 2 输入n,m,q.n限制了你询问的年份,m台时光机, ...
- [DB][MySql]关于取得自增字段的值、及@@IDENTITY 与并发性问题
对于刚从Oracle转向MySql的人都会为,MySql中没有Oracle里的Sequence而感到困惑.MySql中没有了Sequence,那么MySql的主键用什么方式来实现最好呢? 主要有下面几 ...
- 【Bzoj2260】【Bzoj4349】商店购物 & 最小树形图
目录 List Bzoj 2260 商店购物 Description Input Output Sample Input Sample Output Bzoj 4349 最小树形图 Descripti ...