ПредишенСледващото

Photoshop е научил да копирате стилове CSS

В Photoshop CS6.13.1.2 направи полезна актуализация - можете да го копирате CSS стил слой. Разбира се, че до голяма степен ще улесни оформлението, особено в процеса на писане на код за блокиране на градиенти. Известно е, че по-рано за това може да бъде да се използва плъгин CSS3PSD. Реших да разследва и сравни как плъг-ин и вградена способност Photoshop износ CSS стилове.

бутон, градиент и сянка е взета за експеримента. Етикетът на бутон - също с наклона и сянката. Какво се е случило може да се разглежда по-долу.

1. Сравнение външен вид

Photoshop е научил да копирате стилове CSS

Като цяло ми хареса резултата. Може да се отбележи, че различните варианти дават различен нюанс на слоя с текста. Вграденият внос тъмна сянка в сянка запалка CSS3PSD. Въпреки това, и двата метода дават ярки пиксели на закръглението между блока и сянката. Това може да се види по-горе в разширения раздели.

С текст наклони и двете опции работят по същия начин - това е всичко. Стил градиент от текстови слоеве се определя като градиент на блока.

2. Сравнете кода

Списъкът с различията в кода:

  • css3psd не посочва линия височина
  • css3psd-подробно рисува граничния радиус, кутия-сянка. Регистрира възможности за уеб-комплект и -moz-. Докато родния износ ограничен CSS3 имоти
  • за фон изображение CSS3PSD писа 5 версии за различни браузъри, родния износ показва само 2 опции за уеб-комплект и -moz-
  • родния CSS износ точки линия височина за текста и не CSS3PSD
  • родния износ показва подравняване на текст
  • сянка на текста е зададена по различен начин, и следователно показва по различен начин в браузърите

Код, който е от родния CSS в Photoshop:

код щепсел CSS3PSD:

Както можете да видите роден (роден) CSS определя местоположението на елемент спрямо листа, приставката не е така. Сянка текст в CSS3PSD плъгин изглежда по-реалистичен и подобно на оригинала. Но майката е в състояние да изнася за да изложи на височината на линия, и привеждане в съответствие.

Като цяло, в двата процеса, не е изключено необходимостта да се определя кода на ръка.

За мен и двата начина са добри, мисля, че ще ги използват последователно. За блокове и текст с сянка - щепсел CSS3PSD, за прост текст - инлайн CSS износ.

Подобно на този пост? Сподели с приятелите си, те ще оценят:

Свързани статии

Подкрепете проекта - споделете линка, благодаря!