This action might not be possible to undo. Are you sure you want to continue?
Home Work Title/no:- 4 Course Instructor:JASVEEN MAM Date of Allotment:-
Course Code:- cap209
Course Tutor:Date of Submission: 10/12/.09 Section no:- E3801
Student Roll no:-A08
Declaration:“I declare that this assignment is my individual work.I have not copied from any other students work or from any other students source except where due acknowledgement is made explicitly in the text. Not as any part being written for me by another person”.
Student Signature:- REENA CHOUDHURY Evaluator Comment:Marks out of:-
Although implementing style sheets in HTML can be complicated Layers are DHTML components and are similar to tables with a few different properties. this is an added advantage in layers. Styles are useful for ensuring that all of the wireframes you create look consistent. The CSS styles palette.Q1. If you have ever used styles in Microsoft Word. CSS styles work in much the same way. This is the layer into which content will be added. background color. .What is the use of Style Sheets in Dreamweaver. Layers are viewed differently in different browsers Create and add content to a layer Click on Insert>Layout Objects>Layers from the menu bar. With cascading style sheets (CSS). How can you add elements into Layers? ANSWER:CSS Styles palette The CSS Styles palette is used for setting up the CSS (Cascading Style Sheet) styles that will govern your wireframe. etc. A style is a description of the formatting properties that you apply to text or a table cell. including things like font color and size. we can specify automatic HTML formatting options that apply to an entire site. Layers can be hidden or made visible. The following image is displayed on the screen.
Create home page of any sports website using designer labels. Naming a layer Dreamweaver gives a generic name such as Layer1. etc. Another way of doing this is by changing the number of Z-index. Changing the order of the layers The above image shows a column name Z below which are numbers. you can hide or show the layers by clicking on the eye icon. While working on layers. Discuss Designer Panels. This column stores the stacking order of the layers. Changing the visibility of a layer In the above image you can see that all the three layers have the open-eye icon. i. whatever.Click inside the frame and add content or insert an image. goto windows and select layers. meaning that the three layers are visible. if it is not displayed. when layers are created. Double click on the name of the layer and enter the new name.e. images. Also create buttons which have hyperlinks. ANSWER: . Layer2. To do this goto the Layers panel. The layer with the highest number will top the stack and that'll be the first layer. You can change this order by dragging the layer names up or down. Just click inside the layer and add text. the panel will appear towards the right. specially overlapped layers. You can give your own name for easy reference. the order in which they are drawn in a browser. Q2.
g. You can now go to the index page and apply your template (if you have one) to format the page and also use CSS . Choose Commands/Create Web Photo Album from the toolbar 4. thumbnails .There are two panels in the design panel group: CSS Styles and Layers. 2.contains the images in its original form 3. Also animate it in a way so that it changes background color automatically.htm page which will have all the thumbnails with links to the larger images 5. The album will now be in it's simple unformatted state. rearrange. album) Open any page within the site 3.contains the thumbnails images . 3. The layer panel shows all the layers of the open document. pages . You will have a folder called album under which there will be 3 folders as follows: 1. index. It can be used to lock or unlock.contains the pages in which the larger images are inserted along with the navigation to navigate between pictures and go back to home 4. 2. Create a folder for your photo album (e. ANSWER:.Open your Dreamweaver site. Create a homepage of cosmetic products website in Dreamweaver. 1. CSS styles are used to maintain the styles in the document and creating and attaching style sheets. and rename the layers.
Switch to your web browser and surf to the page from which you can get the cut-and-paste HTML code. 5. The code you copied earlier will be inserted at the cursor position. PART B Q4. 4. . 2. What are Form Elements? How can you insert form into frames? Can any page of a website be created without frames. The gallery now will look like its part of the site.How are media elements in Dreamweaver? Can you insert a page created in HTML code into a dreamweaver image ? If yes. Click the "View" menu again.Styles to format the text. You can now save your page and upload it to your website 5. and click on the spot where you want to insert the code. Switch to Dreamweaver's Code view by clicking the "View" menu followed by the "Code" menu item. Select the code with your mouse by dragging over all the text. followed by the "Design" menu item to return to Design mode. Start up Dreamweaver and open the page that you want to edit. and select the "Copy" item from the pop-up menu that appears.how can you implement such thing? ANSWER:- Steps to Inserting Cut-and-Paste HTML Code into Your Site 1. You should be able to see the results of your insertion. click your right mouse button. Return to Dreamweaver. 6. Click the "Edit" menu and select the "Paste" item. 3.
etc. Also note that in most browsers. <form> . radio buttons. textarea fields.Form elements are elements that allow the user to enter information (like text fields. The type of input is specified with the type attribute. . The most commonly used input types are explained below. in a form. drop-down menus.ANSWER:. Radio Buttons Radio Buttons are used when you want the user to select one of a limited number of choices. etc. the width of the text field is 20 characters by default. A form is defined with the <form> tag. <form> <input type="radio" name="sex" value="male" /> Male <br /> <input type="radio" name="sex" value="female" /> Female </form> How it looks in a browser: Top of Form Male Female Bottom of Form Note that only one option can be chosen. numbers.) in a form. <form> First name: <input type="text" name="firstname" /> <br /> Last name: <input type="text" name="lastname" /> </form> How it looks in a browser: Top of Form First name: Last name: Bottom of Form Note that the form itself is not visible. Text Fields Text fields are used when you want the user to type letters.input elements . checkboxes.</form Input The most used form tag is the <input> tag.
the content of the form is sent to the server. How is creation of Labels and Tables different in HTML and Dreamweaver? Create both in Dream weaver. The file defined in the action attribute usually does something with the received input. . The form's action attribute defines the name of the file to send the content to. The page will show you the received input. ANSWER:.asp" method="get"> Username: <input type="text" name="user" /> <input type="submit" value="Submit" /> </form> Top of Form Username: Bottom of Form If you type some characters in the text field above. and click the "Submit" button. the browser will send your input to a page called "html_form_submit. <form name="input" action="html_form_submit. <form> I have a bike: <input type="checkbox" name="vehicle" value="Bike" /> <br /> I have a car: <input type="checkbox" name="vehicle" value="Car" /> <br /> I have an airplane: <input type="checkbox" name="vehicle" value="Airplane" /> </form> How it looks in a browser: Top of Form I have a bike: I have a car: I have an airplane: Bottom of Form The Form's Action Attribute and the Submit Button When the user clicks on the "Submit" button. Q6.Form labels With the accessibility options enabled.asp".Checkboxes Checkboxes are used when you want the user to select one or more options of a limited number of choices. Dreamweaver will prompt for appropriate labeling information when form elements are added to your web page.
Designate table headers Assign a scope to row and/or column headers For complex tables. and does not support option 3. This allows the form label to be moved to another position within the page and is most compatible with existing screen readers. then reinsert the form element and add the appropriate label using the dialog Add the appropriate label information in Code view. Dreamweaver surrounds the label and the form element with the label tags. Dreamweaver's visual interface supports option 1 (designating headers). The best results are accomplished by selecting Attach label using 'for' attribute. You can also choose to position the form label before or after the form item. box. 2. You can then select the label style: Wrap with label tag. or No label tag. . the label and the form element must be adjacent to each other. Dreamweaver supports designating table headers in two ways. When this method is used. For this method to work.Simply type the appropriate form label into the Label dialog box. 3. assign headers and id attributes to header and data table cells. then selecting or deselecting the Header option on the Properties panel. row. or column. The Input Tag Accessibility Attributes dialog also provides options for specifying Access key and Tab Index. 2. if the table already exists. Attach label tag using 'for' attribute. there are three methods that can be used: 1. Delete. neither of which are necessary for accessibility and both of which are often misused. partially supports option 2 (assigning scope). which limits your ability to move the label and is not fully supported in all screen readers. Select both the label and the form element and select Insert > Form > Label. First. you can identify table headers by selecting a table cell. Data table accessibility There are three principles involved in making data tables accessible to screen reader users: 1. To add labels to form elements already within a web page. 3.
these should both be provided. The Table accessibility dialog box also allows the addition of Caption and Summary. You can then choose whether the table has no headers (None).Second. column headers (Top). both of which provide additional information about the contents of the table. row headers (Left). In most cases. . or row AND column headers (Both). Dreamweaver will designate the correct cells as table headers using the <th> tag. if the accessibility options are enabled in the Preferences. a dialog box will be presented when the table is inserted.
This action might not be possible to undo. Are you sure you want to continue?
We've moved you to where you read on your other device.
Get the full title to continue listening from where you left off, or restart the preview.