Как заблокировать код html

Отключаем нежелательные HTML-элементы с помощью CSS

Часто, когда мы сдаем проект клиенту, мы теряем контроль над HTML-кодом. Иногда клиент использует CMS (Системы Управления Контентом), которые дают ему полный контроль над теми или иными частями HTML-кода. Иногда клиент просто использует наши темплейты для вывода своего кода в документ.
В большинстве случаев довольно тяжело проинформировать клиента о том, как использовать темплейты или CMS, которые вы ему предоставляете, а иногда просто неприемлемо толкать пламенные речи о семантической верстке и веб-стандартах. Клиент может/будет использовать «старую, добрую разметку», ту, которую он знает, просто потому что она работает и выглядит так как он привык. Скорее всего в ней будут присутствовать нежелательные (deprecated) тэги и атрибуты, такие как bgcolor, align и «вечный» font. Эта статья о том, как блокировать нежелательные HTML-тэги с помощью CSS, тем самым аккуратно направляя клиента в правильном направлении.

Есть несколько решений проблемы. Одно из них — вывод предупреждающего изображения с помощью CSS, когда изпользуются нежелательные тэги. Подробные обьяснения этого способа есть здесь и здесь. Второе решение — «вырезание» нежелательных тегов и атрибутов на стороне сервера. Этот способ является наиболее эффективным, другое дело что не всегда есть контроль за сервером где расположен сайт.
Идея состоит в том, чтобы сохранить естественный каскад и наследие стилей во всех браузерах, элегантно «отключая» HTML, нежелательный к использованию клиентом. И тогда клиент перестанет использовать его, потому что нежелательные тэги просто перестанут «работать». Элегантный и ненапрягающий клиента способ, который направит его по верному пути.
Нежелательные HTML-тэги и атрибуты:

      bgcolor border align vspace hspace valign width height

Решение
В идеале мы могли бы просто откорректировать некоторые HTML-тэги, вставив значение inherit для эквивалентного CSS-свойства. Браузеры, работающие по стандартам, просто проигнорируют заданные в коде нежелательные атрибуты и будут использовать вместо них наследуемые значения в каскаде.
На пример этот CSS:

Соответственно цвет текста внутри тэга font будет цветом, наследуемым по каскаду, а не синим, как задано в коде. То что надо. Но как вы наверняка знаете — у Internet Explorer есть проблемы с наследуемыми значениями. И в седьмой версии тоже. Так что за работу:
Expressions и currentStyle в помощь:

Все чудесно, кроме того что Opera 9 не наследует значение для font-family. К счастью font нас тоже устроит:

С этим разобрались. Перейдем к свойству font-size. Здесь нужна деликатность, так как значение размера шрифта наследуется по отношению к вычисляемому (computed) значению. Предыдушие expression‘ы здесь не сработают, так как если для body выставлено значение свойства font-size, равное 2em, то вычисление значения размера шрифта начнется от этой точки. Браузер проверит значение font-size для родительского элемента тэга font, которое равняется 2em и представит вычисляемое значение, равное 4em (2em от 2em). А это не то что нам нужно. Решение простое. Нужно использовать начальное значение font-size, равное 100% для всех браузеров. Давайте добавим несколько свойств нежелательному тэгу basefont, чтобы и его утихомирить. Вот полный список правил для «укрощения» тэгов font и basefont:

Свершилось! Мы «отключили» большинство нежелательных тэгов, используя только CSS и expression’ы.
А как же атрибуты? HTML4 включает в себя некоторое количество нежелательных атрибутов, которые могут изрядно попортить нервы. Давайте их тоже «повыключаем». Начнем с align:

*[align] < text-align:inherit; >/* Нормальные браузеры */

Все бы хорошо, но IE6 не поддерживает селекторы атрибутов. Посему, нам надо модифицировать expression, для того чтобы он проверял наличие атрибута align у тэга. Вот что получилось:

*[align] < text-align:inherit; >/* Нормальные браузеры */ * < text-align:expression(this.align ? this.parentNode.currentStyle['textAlign'] : ''); >/* IE */

Далее на очереди атрибуты тэга img. Помимо атрибута align, мы хотим отключить атрибуты border, vspace и hspace. Так как значения margin и border не наследуются, то здесь применимо простое правило:

Вот здесь мы как раз сталкиваемся с неразрешимой проблемой для IE6. vspace и hspace не равнозначны свойству margin в нем, поэтому IE6 будет продолжать отображать их. Единственное решение, которое пришло мне в голову это написать маленький скриптик, который будет просто удалять эти атрибуты при загрузке документа:

Я бы предпочел не использовать javascript, но в данном случае я просто не вижу другой альтернативы. Так что пусть будет. Теперь добьем атрибут type в тэге ol:

Таблицы. Финальный шаг. В таблицах, в HTML4/4.01, есть ряд нежелательных атрибутов, которые активно использовались для верстки страниц. Но мы же не хотим, чтобы клиент использовал таблицы для верстки? Поэтому давайте отключим атрибуты width, height, bgcolor, valign и border:

Подведем итоги:
Используя CSS-правила и минимальный javascript, нам удалось «отключить» большинство нежелательных тэгов и атрибутов, элегантно сохраняя естественное наследование. Нам не нужно «учить» клиента, он в любом случае должен будет использовать правильную разметку. С учетом одной, очень важной ремарки — очень важно предоставить клиенту достаточное количество описаных CSS-классов, чтобы он не был ограничен в работе с разметкой.
Все стили вместе:

font,basefont < color:inherit; /* Нормальные браузеры */ color:expression(this.parentNode.currentStyle['color']); /* IE */ font:inherit; /* Нормальные браузеры. Font вместо font-size для Оперы */ font-family:expression(this.parentNode.currentStyle['fontFamily']); /* IE */ font-size:100%; /* Все браузеры */ >center < text-align:inherit; /* Нормальные браузеры */ text-align:expression(this.parentNode.currentStyle['textAlign']); /* IE */ >s,strike,u < text-decoration:inherit; /* Нормальные браузеры */ text-decoration:expression(this.parentNode.currentStyle['textDecoration']); /* IE */ >*[align] < text-align:inherit; >/* Нормальные браузеры */ * < text-align:expression(this.align ? this.parentNode.currentStyle['textAlign'] : ''); >/* IE */ img < margin:0; border:none; >/* Все браузеры */ ol < list-style-type:decimal; >/* Все браузеры */ body < background-color:transparent; /* Все браузеры */ >table,tr,th,td < width:auto; /* Все браузеры */ height:auto; /* Все браузеры */ background-color:transparent; /* Все браузеры */ vertical-align:inherit; /* Все браузеры (включая IE) */ border:none; /* Все браузеры */ >

Вольный перевод и подготовка статьи по материалам monc.se

Источник

Как закомментировать строку в HTML: примеры комментирования кода

Как закомментир о вать текстовую строку или часть кода в html

Главная суть комментирования абсолютно в любом языке программирования — все что закомментировано «не читается» браузером, компилятором или интерпретатором. То есть, в нашем случае, все что мы хотим закомментировать в html , не будет «читаться» браузером и, соответственно, не будет выводит ь ся на веб-страницу.

В html нет специального тега или способа создавать отдельно однострочный или многострочный комментарий, как есть в других языках программирования. В html один инструмент на все случаи жизни и неважно нужно вам закомментировать одну строку, одно слово или целый блок кода.

Стандартный способ закомментировать в html

Стандартный способ закомментировать строку или блок кода html осуществляется при помощи определенного набора символов. Шаблон комментария выглядит так:

То ест ь абсолютно все, что будет прописано внутри этой конструкции , и будет считаться комментарием в html и не будет показываться в окне обозревателя.

При написании такой конструкции с целью временного «отключения» какой-то части кода нужно быть очень внимательными, чтобы случайно не зацепить комментарием какой-нибудь работающий и нужный тег вашего кода.

Также нужно избегать ситуации двойного комментирования, когда внутри одного комментария пишут еще один. В этом случае комментарии будут работать следующим образом : как только обозреватель «встретит» первый набор символов для закрывания комментария, действие комментария заканчивается и все, что будет написано после него, будет доступно на веб-странице, в том числе и второй набор символов для закрывания комментария.

В былую молодость html у комментариев был свой собственный тег . Современные версии браузеров его не поддерживают, лишь Internet Explorer 8.0 и более ранних версий и то, этот тег применяется только внутри тега «body».

Нестандартный способ закомментировать строку или блок кода html

Данный способ, как и тег «comment» , практически не используется, однако знать его для общего ознакомления надо. Вдруг когда-нибудь встретите закомментированный таким способом код — хоть будете знать, что это за конструкции.

Мы прекрасно знаем, что в документе html, помимо его блоков , часто можно встретить теги блоков стилей или скриптов. Для каждого из этих блоков есть собственные стили для комментирования, которые также «не читаются» браузером.

Получается, что нестандартным способом можно закомме н тировать строку или блок кода, если поместить нужный код внутри этих тегов и закомментировать его их способами. Конструкция будет следующей:

/*

*/

Заключение

Используйте стандартный способ закомментировать строку или блок кода в html — так надежнее и правильнее. Неважно для чего вам комментарий на страницы — важно , чтобы он был правильно оформлен и не приносил вреда.

Мы будем очень благодарны

если под понравившемся материалом Вы нажмёте одну из кнопок социальных сетей и поделитесь с друзьями.

Источник

Как закомментировать на время код HTML, CSS или PHP, JS

…сегодня мы в этой коротенькой, но полезной статье, разберемся, как же комментируется различный программный код. Много говорить не стану, ибо если вас подобное заинтересовало, то вы уже столкнулись с вопросами этой задачи, и представление о ней имеете. Также о представлении можно прочесть предыдущую статью Оформление внешних и внутренних ссылок визуальными иконками CSS (в финале статьи подробное видео о правилах и способах комментирования кодов)

Вы зашли по адресу… но несколько слов для ясности и пользы дела. Наверняка видели, как это делается с CSS-кодом , так как сss представляет наибольший интерес у многих начинающих, как и я.

Но обратите внимание, что комментарии используются также и в html и php… А ведь большинство начинающих путаются на начальном этапе своей работе с сайтом и не знают, как дописать себе необходимые пояснения. Ведь бывает же так, например, вам потребуется на какое-то время деактивировать код html, а потом снова возобновить его функцию — это запросто реализовать, если вы сделали себе пометки на «полях», да мало ли что.

Но что следует помнить о «комментариях» вообще — тут всё в строгой зависимости от того, с каким файлом вы работаете конкретно, а следовательно и код применения различен.

ошибки в комментариях к коду — по версиям php

php 8

время от времени языки программирования меняются (их версии), а следовательно относитесь внимательнее к тому, что и как комментируете!

Как известно, не так давно вышла версия php 8 — некоторые пользователи столкнулись с проблемами!

В данной статье коснемся, скажем так, синтаксиса — правописания))…

Например, если комментируете в самом финале кода, то обязательно соответственно закрывайте комментарий! иначе, в новейших версиях php (подобные правила касаются многих ЯПов) бесконечно закомментированный блок вызовет ошибки! Белый экран.

…далее: никогда не ЛЕПИТЕ друг к дружке символы комментариев к тегам кода. неряшество в коде, как и в жизни, вызывает неприличные ошибки.

На мой взгляд, лучше потратить несколько лишних минут времени, но написать чистенький и аккуратный код и комментарии. Это в будущем сэкономит массу времени!

Источник

Друзья, каким тегом запретить просмотр HTML-кода страницы.

Евгений, я не собираюсь всерьёз ничего прятать. хочу просто пошутить — для друзей.
dikanev@mail.ru — супер, спасибо.

Не совсем понятен вопрос. Зачем нужен html-код, если просматривать его нельзя?

Чтобы браузеры не обращали на него внимание, можно сделать его коментарием:

Просмотр поисковыми роботами можно запретить тегом код для Гугла и

для Яндекса.

Скрыть часть кода в ответ на событие (нажатие кнопки и т.п.) можно скриптом:

Вызов этой функции уберет любой код из элемента с , например,

Upd.
Делай тег , внутри которого ничего нет. Затем для любого элемента по нажатию на который код должен выскочить делаешь свойство onClick = «ShowHiddenHTML()». А где-нибудь в начале страницы должен быть скрипт:

Запретить просмотр кода можно только для ламера.. . но это бессмысленно, так как ламер и не подозревает о его существовании и никогда не задастся целью его смотреть, а если и посмотрит, то все равно ничего не поймет, ему это не интересно.. . А скрывать код от профессионала также бессмысленно, так как раз уж у меня открылась страница в браузере, то я просмотрю ее код при желании сотней способов.. . и мне по барабану, чего ты там назапрещаешь.

Источник