Я здесь новенькая, а уже прошу помощи, но я не знаю, как мне быть. Делаем с одной девушкой сайт. Она в фотошопе рисует, а я версткой балуюсь.
Необходимо, чтобы на сайте было как бы 2 вида активных ссылок, я не знаю, как это сделать.
В горизонтальном меню на одной ссылке есть подчеркивание - это обозначение стр., на которой находишься. и так же с нумерацией (только наоборот т.е. без подчеркивания та, на которой находишься + выделение цветом) и в левом меню - кружочек и выделение цветом.. это обозначение стр на которой стоишь.
You can post now and register later.
If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.
Актуальные контакты:
Telegram: @Nikker_web
E-Mail: tarasevich.email@gmail.com
Портфолио https://www.behance.net/d4d4186e
Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ
Актуальные контакты:
Telegram: @Nikker_web
E-Mail: tarasevich.email@gmail.com
Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ
Портфолио https://www.behance.net/d4d4186e
Question
La_Perm
Дорогие пользователи!
Я здесь новенькая, а уже прошу помощи, но я не знаю, как мне быть. Делаем с одной девушкой сайт. Она в фотошопе рисует, а я версткой балуюсь.
Необходимо, чтобы на сайте было как бы 2 вида активных ссылок, я не знаю, как это сделать.
В горизонтальном меню на одной ссылке есть подчеркивание - это обозначение стр., на которой находишься. и так же с нумерацией (только наоборот т.е. без подчеркивания та, на которой находишься + выделение цветом) и в левом меню - кружочек и выделение цветом.. это обозначение стр на которой стоишь.
Сейчас имеется вот такой css(не мной написанный)
* {
margin:0;
padding:0;
}
body,html {
font-family:arial;
background:#dcd7cb;
height:100%;
}
a, img {
outline:none;
border:none;
}
a {
text-decoration:none;
cursor:pointer;
}
a:hover {
text-decoration:underline;
}
a:link {
color: #be692a;
}
#wrapper {
width:990px;
margin:0 auto;
min-height:100%;
}
/* HEADER */
#header {
float:left;
background:url("../images/bg-header.jpg") no-repeat center;
width:990px;
height:337px;
}
.logo {
float:left;
background:url("../images/logo.jpg") no-repeat;
width:189px;
height:284px;
margin:66px 0 0 43px;
position:relative;
z-index:1;
}
/* END HEADER */
/* CONTENT */
#content {
float:left;
width:990px;
min-height:100%;
background:url("../images/bg-content.jpg") repeat-y;
}
#left-column {
float:left;
width:240px;
margin-left:19px;
text-align:center;
}
#left-column h3 {
border: 1px solid #D9CBBD;
color: #917454;
float: left;
font-size: 16px;
margin: 0 31px 16px;
padding: 6px;
background:#d8d0c4;
}
.nav {
float:left;
padding:40px 30px 0;
width:180px;
margin-bottom:27px;
}
.nav ul {
list-style-type:none;
}
.nav ul li {
text-align:left;
}
.nav ul li a {
color:#853d08;
font-size:14px;
}
.interesting-link {
padding:0 40px;
float:left;
}
.interesting-link ul {
list-style-type:none;
}
.interesting-link ul li {
line-height:1.1;
text-align:left;
}
.interesting-link ul li a {
color:#7e5a3a;
font-size:13px;
}
#right-column {
float:left;
width:667px;
margin:20px 0 0 28px;
}
.h-nav {
display:block;
margin-bottom:25px;
text-align:center;
}
.h-nav ul {
list-style-type:none;
}
.h-nav ul li {
display:inline;
margin:0 7px;
}
.h-nav ul li a {
font-size:19px !important;
color:#8b4a01 !important;
}
#right-column a {
font-size:14px;
color:#2e1304;
}
#right-column p {
font-size:14px;
color:#2e1304;
margin-bottom:25px;
line-height:1.3;
}
.our-partners {
display:block;
background:#d9d3c5;
padding:8px 5px 12px;
width:640px;
text-align:center;
margin-top:100px;
clear: both;
}
.our-partners h4 {
float:left;
width:620px;
font-size:16px;
color:#917454;
font-weight:normal;
padding:0 10px 8px;
border-bottom:1px solid #c7b7ac;
text-align:left;
}
.link-our-partner {
float:left;
}
.link-our-partner-center {
margin:0 190px;
}
.link-our-partner ul {
list-style-type:none;
}
.link-our-partner ul li {
padding:0 20px;
line-height:1.6;
text-align:left;
}
.link-our-partner ul li a {
color:#7e5a3a !important;
font-size:14px;
}
.clear {
clear:both;
}
/* END CONTENT */
/* FOOTER */
#footer {
margin:0 auto;
width:990px;
height:103px;
background:url("../images/bg-footer.jpg") no-repeat;
position:relative;
}
.wetchik {
position:absolute;
left:48px;
bottom:15px;
}
/* END FOOTER */
А вот то, к чему надо стремиться
http://keep4u.ru/full/1992d6cc43b120b00b0ff080a4d0dd10.html
http://keep4u.ru/full/ed30a0ae122f37295ea37bd7cc8ed041.html
Edited by La_PermLink to comment
Share on other sites
3 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.