The "Freeola Customer Forum" forum, which includes Retro Game Reviews, has been archived and is now read-only. You cannot post here or create a new thread or review on this forum.
First of all create a design in photoshop.
1.Open new 450 x 27 px image.
2.Create new layer called “border” and fill background with #0066cc
Click Here
3. Then select “border” layer with Rectangular Marquee Tool (M), go to Select > Modify > Contract and contract it with 1 px and then delete the selection left.
Click Here
4. Create a new layer called “background” , then go to Select > Reselect (Shift+Ctrl+D) . Set foregound to #0099ff and background to #0099cc. Then right click on “background” layer, Blending Options > Gradient Overlay and make changes like in the image below.
Click Here
5. After make a selection with Rectangular Marquee Tool (M) on background layer like in image below, then create a new layer called “background_hover”.
Click Here
set background to #99ff00 and foreground to #99cc00 and fill that selection by right clicking on “background_hover” layer Blending Options > Gradient Overlay, after go to Blending Options > Stroke on the same layer and make the changes like in the second image below.
Click Here
Click Here
After saving background images we create a css file and write the following code and save it:
Click Here
Then we create a html file and write the following code and save it
Click Here
See the finished thing HERE
1.Open new 450 x 27 px image.
2.Create new layer called “border” and fill background with #0066cc
Click Here
3. Then select “border” layer with Rectangular Marquee Tool (M), go to Select > Modify > Contract and contract it with 1 px and then delete the selection left.
Click Here
4. Create a new layer called “background” , then go to Select > Reselect (Shift+Ctrl+D) . Set foregound to #0099ff and background to #0099cc. Then right click on “background” layer, Blending Options > Gradient Overlay and make changes like in the image below.
Click Here
5. After make a selection with Rectangular Marquee Tool (M) on background layer like in image below, then create a new layer called “background_hover”.
Click Here
set background to #99ff00 and foreground to #99cc00 and fill that selection by right clicking on “background_hover” layer Blending Options > Gradient Overlay, after go to Blending Options > Stroke on the same layer and make the changes like in the second image below.
Click Here
Click Here
After saving background images we create a css file and write the following code and save it:
Click Here
Then we create a html file and write the following code and save it
Click Here
See the finished thing HERE
I almost feel like this is missing something, maybe a youtube video showing how to split up the image and save the components.
I edited my post before you replied :)
t1mmie wrote:
> Hi jubba
>
> Please note that the rules have recently changed slightly and we
> no longer give prizes for 'design' tutorials, but more technical
> threads instead.
>
> Please check the previous submissions for more info.
Surely this is technical though as it is a tutorial on how to use CSS and HTML to make something.
The examples I have used are just for guidance, its not me designing it for you lol
> Hi jubba
>
> Please note that the rules have recently changed slightly and we
> no longer give prizes for 'design' tutorials, but more technical
> threads instead.
>
> Please check the previous submissions for more info.
Surely this is technical though as it is a tutorial on how to use CSS and HTML to make something.
The examples I have used are just for guidance, its not me designing it for you lol
Hi jubba
Please note that the rules have recently changed slightly and we no longer give prizes for 'design' tutorials, but more technical threads instead.
Please check the previous submissions for more info.
Edit: I suppose this more or less fits in to technical anyway. Is there a final result we can see? :)
Please note that the rules have recently changed slightly and we no longer give prizes for 'design' tutorials, but more technical threads instead.
Please check the previous submissions for more info.
Edit: I suppose this more or less fits in to technical anyway. Is there a final result we can see? :)
First of all create a design in photoshop.
1.Open new 450 x 27 px image.
2.Create new layer called “border” and fill background with #0066cc
Click Here
3. Then select “border” layer with Rectangular Marquee Tool (M), go to Select > Modify > Contract and contract it with 1 px and then delete the selection left.
Click Here
4. Create a new layer called “background” , then go to Select > Reselect (Shift+Ctrl+D) . Set foregound to #0099ff and background to #0099cc. Then right click on “background” layer, Blending Options > Gradient Overlay and make changes like in the image below.
Click Here
5. After make a selection with Rectangular Marquee Tool (M) on background layer like in image below, then create a new layer called “background_hover”.
Click Here
set background to #99ff00 and foreground to #99cc00 and fill that selection by right clicking on “background_hover” layer Blending Options > Gradient Overlay, after go to Blending Options > Stroke on the same layer and make the changes like in the second image below.
Click Here
Click Here
After saving background images we create a css file and write the following code and save it:
Click Here
Then we create a html file and write the following code and save it
Click Here
See the finished thing HERE
1.Open new 450 x 27 px image.
2.Create new layer called “border” and fill background with #0066cc
Click Here
3. Then select “border” layer with Rectangular Marquee Tool (M), go to Select > Modify > Contract and contract it with 1 px and then delete the selection left.
Click Here
4. Create a new layer called “background” , then go to Select > Reselect (Shift+Ctrl+D) . Set foregound to #0099ff and background to #0099cc. Then right click on “background” layer, Blending Options > Gradient Overlay and make changes like in the image below.
Click Here
5. After make a selection with Rectangular Marquee Tool (M) on background layer like in image below, then create a new layer called “background_hover”.
Click Here
set background to #99ff00 and foreground to #99cc00 and fill that selection by right clicking on “background_hover” layer Blending Options > Gradient Overlay, after go to Blending Options > Stroke on the same layer and make the changes like in the second image below.
Click Here
Click Here
After saving background images we create a css file and write the following code and save it:
Click Here
Then we create a html file and write the following code and save it
Click Here
See the finished thing HERE