Мой совет не берите старый код - запутаетесь! Начните просто с нуля.Не верстайте таблицами главное , а попробуйте научится сразу БЛОЧНОЙ верстке=) вот примерный каркас страницы с БЛОЧНОЙ версткой: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title>Название</title> </head> <body> <div id="wrapper"> <div id="header"> </div> <div id="sidebarL"> </div> <div id="sidebarR"> </div> <div id="content"> </div> <div id="footer"> </div> <div> </body> </html> Почитайте литературу про верстку в целом, про тэг <div> про css , для первого толчка думаю инфы хватит... ... ...
Мнда. Тут проще сверстать, чем объяснить, как мне кажется. Если вкратце — для того, чтобы сделать что-то подобное вам надо использовать связку CSS/HTML. Выглядеть это дело будет примерно так: Код писался приблизительно, и спросонья, попробуйте уяснить основную идею. HTML-код: Код: <div class="cabinet"> <ul> <li class="cab_header">Личный кабинет</li> <li ><a href="#" class="item2">Авторизация</a></li> <li ><a href="#" class="item3">Регистрация</a></li> <li ><a href="#" class="item4">Забыли пароль?</a></li> ... <li class="item5"><a href="#">Редактировать подписку</a></li> </ul> </div> CSS-код же будет вида: Код: .cabinet ul { list-style-type: none; float: left; width: 100%; } .cabinet li a { display: block; width: 100%; padding: 3px 5px 3px 35px; } .cabinet li a.item2 { background-image: url(/images/icon1.png); background-repeat: no-repeat; background-position: left middle; }
font awesome самое лучшее что есть и не надо картинок лепить)) а сначала вам стоит поучить html css а иначе залезете и что то не закроете и полетит ваш сайт))