|
Цитата:
|
|
Но про верстку мне интересно, если не сложно, с удовольствием мы посмотрела, как правильно.
|
Сейчас страницы составляют из трех основных тегов - <div>, <span> и <table>, плюс, конечно же, неизмненные <form>, <input> , <img>, <button>, <a> и тому подобные. Цвет текста, фон, и прочее подобное прописывается при помощи css. CSS имеет два варианта записи. Первый - все стили прописываются в специальном теге <style>, элементы, к которым они применяются, задаются при помощи селекторов. Второй - стили прописывается непосредственно в элементе в атрибуте style, естественно, они будут применяться к этому самому элементу. Чаще всего стили наследуемы.
<div> - блочный элемент, то есть, его ширина равна 100% от родительского элемента либо специально указанной в стилевом свойстве width. Высота блока равна высоте его содержимого либо указанной в стилевом свойстве height. Так или иначе, любой блочный элемент не дает уместиться в том же ряду ни одному другому:
<div style="color: blue">Блок.</div>
<button>Трям</button>
Несмотря на то, что между элементами не стоит тега переноса строки <br />, они находятся на разных строках.
Тег <span> - строчный элемент. И ширина, и высота блока равны высоте его содержимого, насильно задать их невозможно. В одном ряду может распологаться сколько угодно строчных элементов.
<span style="background-color: yellow; height: 500px; width: 300px;"> Трям </span>
<span style="background-color: pink; height: 100px; width: 1px;"> Другой трям </span>
Стиль отображения элемента может быть указан через стилевое свойство display. Полный список возможных его значений можно просмотреть
тут. Основные значения:
- none - элемент не отображается, страница показывается так, будто бы его и нету.
- block - размер подобного элемента настраиваемый, так или иначе занимает весь ряд (<div> по умолчанию именно такой).
- inline-block - размер подобного элемента настраиваемый, весь ряд не занимает.
- inline размер равен размеру содержимого, весь ряд не занимает (по умолчанию таков <span>).
К элементам принято обращаться по уникальному идентификатору, а не через имя.
<div id="mydiv">Траляля</div>
<script>alert(document.getElementById('mydiv').innerHTML)</script>
Формы используются только в тех случаях, когда необходима коммуникация с сервером.