Css+div Web page production PS Chettu Raiders

Source: Internet
Author: User
Tags border color

Understanding Photoshop (PS) CSS Chettu required tools

Adobe Photoshop is usually called PS.

div CSS Prerequisite cut diagram Tool PS screenshot

Most of the understanding of Photoshop is limited to "a good image editing software", do not know its many applications, in fact, the application of Photoshop is very extensive, in the image, graphics, text, video, publishing all aspects are involved.

Please see the following description:

Graphic Design

Graphic design is the most widely used in the field of Photoshop, whether we are reading the book cover, or the street to see the Strokes, posters, these rich image of the plane print, basically need Photoshop software for the image processing.

Repair Photos

Photoshop has powerful image-grooming capabilities. With these features, you can quickly repair a damaged old photo, but also can repair the face of defects such as spots.

Advertising photography

Advertising photography as a very strict vision requirements of the work, its final finished product often to be modified by Photoshop to get satisfactory results.

Image Creative

Image creativity is Photoshop's expertise, through the processing of Photoshop can be a different object together, can also use the "Cat for the Prince" means to make the image of the great changes beyond recognition.

Art text

When text encounters Photoshop processing, it is doomed to no longer normal. Photoshop enables you to change the text in a variety of ways, and use these artistically processed text to add an effect to the image.

Web page Production

The popularity of the internet is an important reason why more people need to master Photoshop. Photoshop is an essential web image processing software when making Web pages.

Post-decoration of architectural effect chart

When making architectural effects, including many three-dimensional scenes, the color of the scene, including scenes, often needs to be added and adjusted in Photoshop.

Painting

Because Photoshop has a good painting and color palette function, many illustrator designers often use pencil to draw drafts, and then use Photoshop to fill the color method to draw illustrations.

In addition, the most popular pixel paintings in recent years have also been used by designers to create works in Photoshop.

Draw or process a three-dimensional post chart

In the three-dimensional software, if we can make a good model, and can not apply to the model of realistic placard, also can not get better rendering effect. In fact, in the production of materials, in addition to relying on the software itself has material functions, using Photoshop can be made in three-dimensional software is not available in the appropriate material is also very important.

Wedding photo Design

At present, more and more wedding photo studio began to use digital cameras, which will be the wedding photos to deal with the design of a new industry.

Visual creativity

Visual creativity and design is a branch of design art, this kind of design usually does not have very obvious commercial purpose, but because he provides the broad design space for the general design amateur, therefore more and more design enthusiasts begin to study Photoshop, and carries on the personal characteristic and the style visual originality.

Icon Making

Although using Photoshop to make icons is a bit overqualified, the icons made using this software are really exquisite.

Interface design

Interface design is an emerging field, has been more and more software companies and developers to pay attention to, although not yet a new career, but I believe it will soon appear professional interface designer career. There is no professional software for interface design at the moment, so most designers are using Photoshop.

The above list of 13 major areas of Photoshop application, but in fact its application more than these. For example, the current film post-production and two-dimensional animation production, Photoshop also has applications.

Features of Photoshop:

From the functional perspective, Photoshop can be divided into image editing, image synthesis, school color and special effects production section.

Image editing is the basis of image processing, which can make various transformations such as amplification, reduction, rotation, tilt, mirror, perspective and so on. can also be copied, remove spots, repair, modify the image of the damage and so on. This in the wedding photography, portrait processing has a very large use, to remove the people are not satisfied with the parts, landscaping processing, get a very satisfactory effect.

Image synthesis is to put several images through the layer operation, tool application synthesis of a complete, convey the clear meaning of the image, this is the only way to art design. Photoshop's drawing tools allow for a good blend of exotic images and ideas, making it possible to make the image synthesis seamless.

The color of the school is one of the most powerful functions in Photoshop, it can conveniently and quickly adjust and correct the color of the image, and can also be switched in different colors to meet the image in different fields such as web design, printing, multimedia and other applications.

Special effects produced in Photoshop are mainly made of filters, channels and tools for comprehensive applications. Including the image of special effects and special effects of the production of words, such as oil painting, relief, plaster painting, sketch and other common traditional art skills can be completed by Photoshop effects. and a variety of special effects word production is a lot of art designers are interested in Photoshop research reasons.

The above information quoted Baidu Encyclopedia Photoshop Introduction: http://baike.baidu.com/view/2929.htm

We recommend using Adobe Photoshop CS 8.0 version

Summarize:

Photoshop here for us is mainly to let you know is the Web page art production tools, web art development tools, div+css refactoring necessary tools, the general design of the Web page art are not laminated is in the PSD format to save, So note that if you use PS Design Web Art finally do not merge file layer, the last PSD format to save for later changes and cut the map.

What PS software is used to do in Div CSS development

Photoshop software abbreviation PS in the Div CSS development for what to do?

In Div CSS Development, PS software is an essential software, mainly used for div+css development when cutting out the layout of picture material, get width value, get height value, get color value, get padding value, get margin value, etc.

Develop PS in the entire CSS play role

PS software has been used in CSS div development, because the entire development needs PS to open the artwork (common PSD file), because we layout the style words or style values need to use the PS software to obtain, so the entire development process of CSS Code development software and PS software Open at the same time.

What does PS development get?

All the style values in the CSS layout are obtained from the artwork, rather than guessing to set the style values arbitrarily. For example, set the width, height, padding, margin size values are using the PS software from the open artwork using slicing tools to obtain, specific methods to get tips screenshot DIVCSS5 will be given in the following PS tutorial; in the layout of the page, set the background color, the font color, These specific values, such as border color, are certainly 100% to get the correct color value from the artwork, rather than to guess the approximate setting.

We are in the layout of CSS, the specific length of the size of a large time can not be error 1px, color value can not be error, or here error point where the error point of the final production of HTML can be imagined, of course, is not used and not rigorous.

DIVCSS5 Last tip:

In the development of CSS process is always the development of CSS Software and PS software is always open at the same time, the development of code in the process of needing value immediately back to the PS software to obtain accurate, of course, a lot of will not PS software, but nothing in fact in the development of CSS in the PS software on those The next DIVCSS5 will be for everyone in the form of graphics and text tutorials to dedicate.

PS Software CSS Chettu application common shortcut keys

Photoshop software CSS Chettu application common shortcut key Introduction

This section DIVCSS5 for you to introduce the PS software in the Chettu of the commonly used shortcut keys, through the introduction of shortcut keys to not PS You also have a certain application of PS.

1, enlarge the art diagram

ctrl+++

Hold down the CTRL key and press the "+" plus key to enlarge the artwork open

2, reduce the art diagram

CTRL---

Hold down the CTRL key and press the "-" minus key to keep zooming out of the open artwork

3, drag the art diagram

Hold "SPACEBAR" when the mouse will become the same as the palm of the icon, this time the mouse click on move can drag the entire Web page artwork

4, Full-screen and fixed screen mode

The Web page artwork into an unfixed drag range, English lowercase input situation in the "F" letter key, switch, you can three modes of mutual transfer

Photoshop CSS Chettu often with tools

Photoshop Chettu often use tools, CSS div to make the former PS software commonly used tools introduced.

1. Mobile Tools

PS Mobile Tool screenshot

Often used to select the Layer object to use, move the selected layer corresponding (picture or type layer) in the drawing position

2. Slicing Tools

PS Slice Tool screenshot

Slicing tool, is the most important tool in the Chettu, directly on the drawing can be cut out of the picture area, and finally can be exported to the use of CSS layout of the picture material.

3. Slice Selection Tool

PS Slice Selection Tool screenshot

The slice selection tool is actually corresponding to the slice tool, in a drawing, using the slice tool will cut out many slices of the area, but to modify or select a slice of the previous slice of the use of slices can only use the slice selection tool to select the corresponding slice area for selection or modification.

4. Front View

Foreground color

Two squares are squares, and the top of the float is the foreground color. The foreground color can be filled with a dashed selection or layer by using the shortcut key "Alt+del" key combination.

5, background color

PS Background Color Tool screenshot

Two squares is the same as a square, back to the background color. Background color You can use the shortcut key "Ctrl+del" to fill the corresponding dashed selection or layer.

6. Font Tools

PS Font Tool screenshot

Font tools can be clicked on the design map directly after the input text, text can change the font size, font, bold, italic and other landscaping effects.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.