Web Design Southampton: BrightByte Studio

2015-02-23_09-52-54

I found this site on a website that collects all the cool websites for designers. This site attracts me because it is displayed in the way that I want to design my own personal website. It is clean, stylish, user-friendly, and all the images on it are large and visual.

One thing I’d always want to learn is how to stabilize my navigation bar to make it always on the top of the page however the page is scrolled down. I’ve seen a lot of websites with its navigation bars always on top or left, making it very easy for users to navigate whenever they want. I also would like to say that the web developer tool bar is very useful; it allows you to check the specific CSS or other web language of the certain element on a page. I didn’t expect it to be that easy to style the navigation bar this way until I saw it in the CSS style information. It is just like this:

#nav.fixed
{
  position: fixed;
  top: 0px;
  z-index: 100;
  bottom: auto;
}

I also like the way the site display the pictures and how the pictures appear when hover. But I still need to figure out how did the designer do it.

a, a:visited
{
  color: #c76c5d;
}

:focus
{
  outline-width: medium;
  outline-style: none;
}

.full_link
{
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  display: block;
}

a:focus
{
  outline-width: medium;
  outline-style: none;
}

a:active, a:hover
{
  outline-width: 0px;
  outline-style: none;
}

a:link, a:visited:link
{
}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s