@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
//css code here
}
gulp.task('styles:vendor', function() {
gulp.src(mainBowerFiles({
"overrides": {
"normalize.css": {
"main": "./normalize.css"
},
"magnific-popup": {
"main": "./dist/magnific-popup.css"
}
}
}))
.pipe(cssFilter)
.pipe(concat('vendor.css'))
.pipe(gulpIf(env !== 'dev', minifyCSS()))
.pipe(gulp.dest(outputDir + 'css'))
});
<div class="container">
<div class="row">
<div class="col-sm-3 col-sm-push-9">зеленый блок</div>
<div class="col-sm-9 col-sm-pull-3">красный блок</div>
</div>
</div>
.col-sm-9 {
background-color: #F00;
}
.col-sm-3 {
background-color: #0F0;
}
<div class="container">
<div class="row">
<div class="col-xs-12 text-center">Авторизация</div>//ваш код внутри
</div>
<div class="row">
<div class="col-xs-4">ID</div>//ваш код внутри
<div class="col-xs-8">input</div>//ваш код внутри
</div>
<div class="row">
<div class="col-xs-4">Пол</div>//ваш код внутри
<div class="col-xs-8">радиобатоны</div>//ваш код внутри
</div>
<div class="row">
<div class="col-xs-4">Проекты</div>ваш код внутри
<div class="col-xs-8">Список</div>ваш код внутри
</div>
<div class="row">
<div class="col-xs-12 text-center">кнопка</div>ваш код внутри
</div>
</div>
var gulp = require('gulp'),
rigger = require('gulp-rigger');
var src = {
html: ['./src/*.html']
},
gulp.task('html', function() {
gulp.src(src.html)
.pipe(rigger())
.pipe(gulpIf(env !== 'dev', minifyHTML()))
.pipe(gulp.dest(outputDir))
.pipe(connect.reload())
});
gulp.task('watch', function() {
gulp.watch('./src/**/*.html', ['html']);
});
<div class="container">
<div class="row">
<div class="col-md-12">
код вашего меню
</div>
</div>
<div class="row">
<div class="col-md-7">
код таблицы
</div>
<div class="col-md-5">
антикапча, кнопки, ссылка
</div>
</div>
<div class="row">
<div class="col-md-12">
код нижней таблицы
</div>
</div>
</div>
bower_components
builds
node_modules
src/
fonts/
img/
template/
header.html
footer.html
. . . . . . . .
js/
script.js
sass/
_base.scss
_butons.scss
_fonts.scss
_forms.scss
_media.scss
_mixins.scss
_sprite.scss
_style.scss
_variables.scss
main.scss
index.html
.gitignore
bower.json
gulpfile.js
package.json
css/
main.css
vendor.css
fonts/
img/
js/
script.js
vendor.js
index.html
FileETag MTime Size
<ifmodule mod_expires.c>
<filesmatch ".(jpg|jpeg|gif|png|ico|css|js|woff)$">
ExpiresActive on
ExpiresDefault "access plus 1 year"
</filesmatch>
</ifmodule>
<IfModule mod_setenvif.c>
BrowserMatch "MSIE" force-no-vary
BrowserMatch "Mozilla/4.[0-9]{2}" force-no-vary
</IfModule>
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
Header append Vary User-Agent
</IfModule>