coliss  id:coliss  



5,515    

-    

-    









*blog  (1)  

*css  (129)  

*design  (323)  

*dev  (268)  

*fav  (2)  

*freebies  (401)  

*ia  (1)  

*idea  (1)  

*js  (152)  

*life  (1118)  

*online  (98)  

*seo  (2)  

*showcase  (1302)  

*software  (7)  

*ui  (2)  

*web  (1)  

*wordpress  (156)  

2010  (44)  

2011  (4)  

2020  (3)  

2021  (1)  

2022  (1)  

2023  (1)  

3D Transforms  (1)  

404  (2)  

@supports  (2)  

AWS  (1)  

Amazon Web Services  (1)  

Apache License  (4)  

Apache License 2.0  (2)  

AutoCAD  (1)  

BSD 2-Clause License  (1)  

CC(1)  

CC0  (5)  

ChatGPT  (2)  

Cordova  (1)  

D3.js  (1)  

EaseUS  (1)  

GNU GENERAL PUBLIC LICENSE  (1)  

GPLv3  (2)  

Helvetica  (1)  

IntersectionObserver  (2)  

Isometric  (1)  

JAMstack  (1)  

JavaScript Visualized  (1)  

M1  (1)  

MIT  (75)  

Masonry  (1)  

NVIDIA  (1)  

Nginx  (1)  

Node.js  (1)  

SF Compact Rounded  (1)  

SIL Open Font License  (7)  

SIL  (1)  

SSR  (1)  

Squigglevision  (1)  

Stable Diffusion  (1)  

Steve Jobs  (10)  

Tailwind CSS  (14)  

TailwindCSS  (1)  

VS Code  (1)  

VSCode  (25)  

View Transitions API  (1)  

WebGL  (2)  

Windows7  (1)  

a11y  (1)  

abstract  (2)  

accessibility  (12)  

accordion  (1)  

acrobat  (1)  

action  (1)  

ad(100)  

adobe  (76)  

adobe cc  (5)  

adobe sensei  (1)  

adobe xd  (25)  

ae(22)  

africa  (1)  

after effects  (2)  

ai(18)  

air  (2)  

airdrop  (1)  

ajax  (1)  

amazon  (2)  

amimal  (1)  

analysis  (1)  

android  (24)  

angular  (4)  

anima  (1)  

animal  (153)  

animation  (28)  

apache  (3)  

api  (2)  

app  (4)  

apple  (33)  

apple card  (1)  

ar(3)  

architecture  (1)  

art  (202)  

art deco  (1)  

artist  (1)  

as(1)  

aspect-ratio  (1)  

async  (1)  

atomic design  (1)  

avif  (1)  

await  (1)  

backdrop-filter  (1)  

background  (12)  

backup  (1)  

banner  (2)  

bark  (1)  

bartender  (1)  

base  (1)  

bem  (1)  

bird  (1)  

blank  (1)  

blog  (5)  

bodobu  (1)  

bokeh  (2)  

book  (106)  

bootstrap  (12)  

border  (1)  

border-radius  (1)  

box-shadow  (5)  

brand  (2)  

branding  (1)  

breadcrumb  (1)  

browser  (5)  

brush  (12)  

button  (18)  

c++  (1)  

caddy  (1)  

calc  (5)  

call to action  (1)  

calligraphy  (1)  

camera  (11)  

camera raw  (1)  

canva  (1)  

canvas  (9)  

card  (100)  

cat  (71)  

cc by 4.0  (1)  

cdn  (1)  

centering  (1)  

chart  (5)  

cheatsheet  (20)  

christmas  (64)  

chrome  (65)  

chromium  (1)  

ci(8)  

circle  (1)  

clearfix  (1)  

clip studio  (2)  

clip-path  (2)  

cloth  (1)  

cms  (3)  

code  (4)  

coding  (1)  

coffee  (9)  

coliss  (2)  

color  (131)  

color picker  (1)  

color-beige  (1)  

color-black  (41)  

color-blue  (17)  

color-blue-green  (1)  

color-brown  (4)  

color-bule  (1)  

color-cyan  (1)  

color-dark  (17)  

color-gold  (1)  

color-gray  (1)  

color-green  (18)  

color-light  (1)  

color-magenta  (1)  

color-muted  (1)  

color-orange  (10)  

color-pink  (6)  

color-purple  (7)  

color-rainboe  (1)  

color-rainbow  (1)  

color-red  (10)  

color-white  (22)  

color-yellow  (5)  

colorful  (5)  

component  (2)  

contact  (1)  

container queries  (1)  

contrast  (1)  

copy  (3)  

cors  (1)  

cover  (1)  

creative  (45)  

creative cloud  (1)  

css  (585)  

css grid  (4)  

css reset  (2)  

css-bug  (1)  

css-in-js  (1)  

css3  (67)  

cssom  (1)  

curl  (1)  

cursor  (1)  

dark mode  (2)  

dark pattern  (1)  

dark theme  (1)  

deep learning  (1)  

design  (196)  

dev  (3)  

dev tool  (6)  

developer  (2)  

devicemotion  (1)  

diagram  (1)  

dialog  (1)  

din  (4)  

dog  (14)  

dom  (3)  

dreamweaver  (2)  

dropbox  (2)  

e-commerce  (14)  

ebook  (7)  

ec(5)  

eco  (5)  

edge  (4)  

editor  (12)  

email  (5)  

eps  (3)  

event  (3)  

facebook  (29)  

fav  (20)  

favicon  (2)  

figma  (25)  

filter  (2)  

firebug  (2)  

firefox  (13)  

fireworks  (4)  

flash  (14)  

flexbox  (36)  

floral  (5)  

flowchart  (3)  

font  (127)  

font awesome  (2)  

font-bold  (2)  

font-size  (5)  

food  (7)  

footer  (8)  

form  (50)  

framework  (21)  

free  (5)  

freebies  (3)  

freebies-font  (40)  

freebies-icon  (44)  

freebies-illustrator  (7)  

freebies-photoshop-action  (4)  

freebies-photoshop-brush  (37)  

freebies-photoshop-pattern  (15)  

freebies-photoshop-shape  (3)  

freebies-psd  (34)  

freebies-template  (26)  

freebies-texture  (55)  

freebies-vector  (7)  

freebies-wallpaper  (9)  

freebies-wordpress-theme  (3)  

frontend  (2)  

funny  (75)  

futura  (5)  

fuuny  (2)  

gallery  (2)  

game  (2)  

generator  (5)  

git  (4)  

github  (6)  

google  (60)  

gradient  (8)  

grid  (29)  

grunge  (18)  

gutenberg  (2)  

halloween  (4)  

hardware  (2)  

head  (2)  

header  (6)  

hover  (5)  

html  (131)  

html mail  (4)  

html5  (86)  

ia(4)  

icon  (77)  

idea  (3)  

ie(9)  

ie10  (5)  

ie6  (5)  

ie9  (9)  

illustration  (9)  

illustrator  (76)  

indesign  (4)  

infographic  (181)  

ink  (2)  

input  (2)  

inspiration  (2)  

instagram  (2)  

inter  (2)  

internet explorer  (2)  

ios  (10)  

ipad  (45)  

iphone  (64)  

ipod  (6)  

javascript  (168)  

jpeg  (3)  

jpg  (4)  

jquery  (58)  

jquery mobile  (2)  

jquery-plugin  (52)  

keyboard  (2)  

kindle  (7)  

landing  (3)  

landscape  (19)  

layout  (3)  

lazyload  (3)  

lego  (10)  

letterpress  (2)  

lightroom  (2)  

line-height  (3)  

linux  (12)  

list  (2)  

loading  (5)  

logo  (172)  

mac  (17)  

macOS  (23)  

mail  (3)  

map  (3)  

margin  (5)  

marketing  (18)  

markup  (2)  

material design  (2)  

media queries  (9)  

menu  (4)  

meta  (3)  

metal  (2)  

microsoft  (4)  

minimalism  (56)  

mobile  (26)  

mockup  (3)  

morisawa  (6)  

movie  (3)  

music  (4)  

nature  (8)  

navigation  (62)  

news  (7)  

normalize  (2)  

notion  (2)  

ofl  (3)  

online  (2)  

opentype  (2)  

opera  (10)  

padding  (5)  

pantone  (6)  

paper  (10)  

parallax  (9)  

pat  (2)  

pattern  (11)  

pdf  (4)  

performance  (3)  

photo  (519)  

photoshop  (112)  

photoshop-action  (2)  

photoshop-brush  (4)  

php  (11)  

pm(2)  

png  (6)  

position  (4)  

prefers-color-scheme  (2)  

premiere  (2)  

premiere pro  (2)  

print  (12)  

product  (93)  

program  (5)  

programming  (3)  

prototype  (4)  

psd  (8)  

pwa  (2)  

qr(2)  

react  (20)  

react native  (2)  

rem  (4)  

remove.bg  (2)  

reset  (7)  

responsive  (30)  

resume  (4)  

retro  (30)  

ribbon  (4)  

safari  (6)  

sale  (2)  

sales  (11)  

sass  (3)  

sbm  (29)  

scroll  (13)  

scroll-snap  (3)  

security  (3)  

select  (2)  

selector  (3)  

semantic  (2)  

seo  (14)  

server  (3)  

sitemap  (5)  

sketch  (18)  

slider  (11)  

slideshow  (4)  

smartphone  (6)  

smoke  (2)  

software  (19)  

spec  (3)  

spinner  (2)  

stationery  (10)  

sticky  (2)  

style guide  (2)  

svg  (80)  

svg font  (2)  

system  (2)  

tab  (5)  

table  (8)  

template  (10)  

texture  (38)  

texture-concrete  (2)  

texture-fabric  (2)  

thumbnail  (2)  

tilt shift  (4)  

tool  (38)  

tooltip  (2)  

transition  (2)  

trend  (18)  

truetype  (2)  

tumblr  (7)  

tutorial-css  (9)  

tutorial-css3  (18)  

tutorial-fireworks  (2)  

tutorial-html5  (4)  

tutorial-illustrator  (20)  

tutorial-jquery  (23)  

tutorial-photosho  (4)  

tutorial-photoshop  (55)  

twitter  (34)  

typography  (252)  

ud(10)  

ui(174)  

usability  (16)  

ux(62)  

vector  (2)  

video  (37)  

vintage  (37)  

visual studio code  (5)  

vue  (16)  

vue.js  (8)  

wallpaper  (33)  

water  (3)  

watercolor  (7)  

web  (20)  

web design  (2)  

webfont  (9)  

webp  (3)  

website  (639)  

web  (11)  

web  (3)  

win  (2)  

windows  (20)  

windows8  (2)  

wireframe  (20)  

wordpress  (19)  

wordpress-plugin  (22)  

wordpress-theme  (34)  

workflow  (5)  

writing  (9)  

xd(10)  

youtube  (5)  

 (10)  

 (2)  

 (15)  

 (2)  

 (3)  

 (3)  

 (7)  

 (2)  

 (2)  

 (2)  

 (2)  

 (6)  

 (2)  

 (2)  

*showcase  (1302)  

*life  (1118)  

website  (639)  

css  (585)  

photo  (519)  

*freebies  (401)  

*design  (323)  

*dev  (268)  

typography  (252)  

art  (202)  


 


 (3)



*design  

tutorial-css  

tutorial-photoshop  


 




*devnavigaitoncoliss (1)  






Design and code a textured navigation menu - WeGraphics  



2 users  

we.graphics  


 


This tutorial is written in 4 hands by me and Piervincenzo. I will drive your through the first part, the one focused on Photoshop and the interface graphical construction. Then I will pass the ball to Piervincenzo, who will explain how to convert the design into a fully functional html/css web navigation bar. Lesson menu Part 1: create the menu in Photoshop Part 2: code the menu - html/css/jQuery
 Design and code a textured navigation menu - WeGraphics


coliss
coliss  2010/11/10  
使  

*design

*dev

navigaiton

tutorial-css

tutorial-photoshop
 



 














1











20246

   



202465

   



202464

   


 

Twitter



@HatenaBookmark


@hatebu

 









   




 



j

k

l

e

o
 

















 









 

















 









 









 







Pro



 




 






App Storeからダウンロード
Google Playで手に入れよう


Copyright © 2005-2024 Hatena. All Rights Reserved.
 



x