Підхід html5 до швидкого прототипу CSS
або: <style>теги вже не просто для голови!
Злому CSS
Скажімо, ви налагоджуєте і хочете змінити сторінку-css, зробіть певний розділ лише кращим. Замість того, щоб створювати свої стилі, вбудовуючи швидкий і брудний і нездійсненний спосіб, ви можете робити те, що я роблю в ці дні, і приймати поетапний підхід.
Немає атрибута стилю вбудованого типу
Ніколи не створюйте свій css inline, під яким я маю на увазі: <element style='color:red'>або навіть <img style='float:right'>Це дуже зручно, але не відображає фактичної специфіки селектора в реальному файлі css пізніше, і якщо ви збережете його, ви пошкодуєте про завантаження технічного обслуговування пізніше.
Прототип з <style>замість цього
Там, де ви використовували б вбудований css, замість цього використовуйте вбудовані <style> елементи. Спробуйте це! Він прекрасно працює у всіх браузерах, тому чудово підходить для тестування, але дозволяє витончено переміщувати такий css у ваші глобальні файли css, коли вам потрібно / потрібно! (* тільки майте на увазі, що селектори матимуть лише специфіку на рівні сторінки, а не специфіку на рівні сайту, тому будьте обережні, щоб бути занадто загальним) Так само чисто, як у ваших файлах css:
<style>
.avatar-image{
float:right
}
.faq .warning{
color:crimson;
}
p{
border-left:thin medium blue;
// this general of a selector would be very bad, though.
// so be aware of what'll happen to general selectors if they go
// global
}
</style>
Рефакторинг inss css інших людей
Іноді ти навіть не проблема, і ти маєш справу з чужим вбудованим css, і тобі доведеться його рефакторировать. Це ще одне чудове використання для <style>сторінки in, так що ви можете безпосередньо знімати вбудований css та негайно розміщувати його прямо на сторінці в класах, ідентифікаторах чи селекторах під час рефакторингу. Якщо ви будете достатньо обережні з вашими селекторами, тоді ви можете перенести остаточний результат у глобальний файл css наприкінці, просто скопіювавши та вставити.
Кожен біт css негайно перенести відразу у глобальний файл css, але з <style>елементами на сторінці , у нас є альтернативи.