Как автоматизировать расчет шрифтов
var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var less = require('gulp-less');
var plumber = require('gulp-plumber');
var notify = require('gulp-notify');
var sourcemaps = require('gulp-sourcemaps');
var autoprefixer = require('gulp-autoprefixer');
var watch = require('gulp-watch');
var fileinclude = require('gulp-file-include');
gulp.task('styles', function() {
return gulp.src('./app/less/main.less')
.pipe(plumber({
errorHandler: notify.onError(function(err) {
return {
title: 'Styles',
sound: false,
message: err.message
}
})
}))
.pipe(sourcemaps.init())
.pipe(less())
.pipe(autoprefixer({
browsers: ['last 6 versions'],
cascade: false
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest('./app/css'))
.pipe(browserSync.stream());
});
gulp.task('html', function() {
return gulp.src('./app/html/*.html')
.pipe(plumber({
errorHandler: notify.onError(function(err) {
return {
title: 'HTML include',
sound: false,
message: err.message
}
})
}))
.pipe(fileinclude({
prefix: '@@'
}))
.pipe(gulp.dest('./app/'))
});
gulp.task('server', gulp.series('styles', 'html', function() {
browserSync.init({
server: {
baseDir: './app'
}
})
gulp.watch(['./app/**/*.html', './app/**/*.js', './app/img/*.*']).on('change', browserSync.reload);
gulp.watch('./app/less/**/*.less', gulp.series('styles'));
gulp.watch('./app/html/**/*.html', gulp.series('html'));
}))
gulp.task('default', gulp.series('server'));
Как прилепить дочерний элемент к низу родителя?
.main_contacts {
...
position: absolute;
left: 0;
bottom: 0;
...
}
.main {
...
display: flex;
flex-direction: column;
...
}
.main_contacts {
...
margin-top: auto;
...
}
return gulp.src('app/sass/**/*.sass')
.sass
, а код пишете, возможно на scss с таким же расширением .scss
.background
и border-image
background
после кодирования:first-child
указывает на первый элемент среди всех элементов, а не первый элемент с данным классом..landing-block__description:first-child
означает элемент с классом .landing-block__description
, который является первым в разметке. .landing-block__title