CSS Slicing help.

by squAze • 8 Dec 2011, 17:11 • Journals
Hello dear programers,
I need to slice some image in css program language, i dont really know exactly how to, anyone has any tutorial or anyone knows how to do it? If you know how to help me please contact me on crossfire or just give me link and/or instructions in comment section. Thank you!
Comments
25
▼
Darkon 8 Dec 2011, 17:22
you can hide some areas of a picture. Some example here: http://www.guistuff.com/css/css_imagetech1.html

If you want to "slice" a picture you have to do it in php.
▼
squAze 8 Dec 2011, 17:24
Ive sliced pictures with fireworks, now i have a file with those pictures, whats the next thing to do? Insert them into webpage again or? I dont have a picture in my head what i have to do, i just know i need to slice them with CSS.
Parent
▼
Darkon 8 Dec 2011, 17:30
No savvy ^^ What will you do exactly? If you slice a picture in firework, why slice it again with css on web? Upload the sliced picture and write <img src="myimage.jpg">
Parent
▼
squAze 8 Dec 2011, 17:42
I have like 5-7 sliced pictures now. Do i have to design the site however i want? I mean, I need to set colors of the backround and texts, then just put those sliced pictures back in?
Parent
▼
Darkon 8 Dec 2011, 17:50
Ah you will code the scaffold of a website :)
You can do it on 2 ways. With Divs or Tables. I would do it with divs. Easier!

Download a clean CSS Template from here: http://www.intensivstation.ch/templates/
then you have to edit the css file. Look for example at the name like header (or banner) and write there the code for your sliced image 1: background-image: url(your_header_picture.jpg);
don't forget the width:???px;height:???px; informations.
Parent
▼
squAze 8 Dec 2011, 17:55
I already have CSS template. So next thing is editing and thats it?
Parent
▼
Darkon 8 Dec 2011, 18:59
Thats up to you. When you edit your template with all images which you sliced you have a finish template with no finction. Now you can think about the navigation and content. The navigation can be as simple as:
<a href="link1.html">Link</a><br>
<a href="link2.html">Link</a><br>
<a href="link3.html">Link</a><br>
<a href="link4.html">Link</a><br>

so you have to create the files link1.html, link2.html ...
In the content div you can add your texts equate to the right file.

Thats the easy way. You can also do it with php files and includes. Another way is to use a CMS like Joomla, Drupal, TYPO3 or Wordpress. Here you only have to adjust your template the cms template files.

edit:// Here the way how to adjust a template to wordpress: http://codex.wordpress.org/Stepping_Into_Templates

there are much more tutorials on google. Learning by doing. The start is not easy.
http://www.google.com/search?q=how+to+adjust+template+to+wordpress

You don't know which way is the right for you? Then read something about static ord dynamic web programming: http://www.google.com/search?q=static+or+dynamic+web
Parent
▼
RazZaH 8 Dec 2011, 17:22
just know how to slice images for photoshop :S
▼
quebratolas 8 Dec 2011, 17:23
in a gaming site css is counter-strike source

+

no chicks

=

image: car_fire_2

or

image: car_crash_0188
▼
squAze 8 Dec 2011, 17:26
I know, thats why i have written CSS slicing help and not only CSS :)
Parent
▼
casek 8 Dec 2011, 17:35
image: tumblr_lv6j1izoaY1qj41h3o1_500
▼
zaNc 8 Dec 2011, 18:50
where the fuck u find these??
Parent
▼
J 8 Dec 2011, 19:20
Respect for spidey pics :p
How you doin'?
Parent
▼
Halidith 8 Dec 2011, 17:43
go follow a study instead of this hobby shit. uve sliced it done now go code it in your site. done

google also helps sometimes and is much faster then cf and you get most of the times additional info
▼
squAze 8 Dec 2011, 17:44
this is my study... so if i get it right, i just need to slice these parts, and code them in a new design of a page?
Parent
▼
Halidith 9 Dec 2011, 00:02
yes kinda, and since you already sliced them as you said you can use them how you were planning to use them. add me on xfire if you want more talk;p
Parent
▼
squAze 9 Dec 2011, 12:13
Already needed to send it. i fuckedup everything and i can just hope they'll anwser me.. if they will and if ill need anyhelp ill contact you :)
Parent
Back to top