HTML & CSS - Web with Adobe Dreamweaver

 Introduction to the internet.

We started the day by discussing the ideas and origin of the internet. listened to a Ted talk about the internet. Finally, we got our hands on the computer and started the program Adobe DreamWeaver. Firstly we went through some basics of the program, some basic knowledge about HTML language. like what are tags and attributes? Then we set up our work environment by splitting the screen. There was code on one side and the result of the code on the other side. We started by designing a very basic format of a webpage with headings, sub-headings, and a couple of images. In that exercise, we learned how to insert headlines, tags, and images. How to change fonts and the color of fonts. how to change the background color. Most importantly how to save the document. 

We used codes like; 

<h1> Big Heading </h1> 

 <h2> Sub Heading </h2>

 <p> Your paragraphs are split with these... </p>

 <a href="https://website.com/">

Text Users See for Link</a> <img src= "Mypic.jpg" /> 

To insert things and manage layout. 

To change the fonts, color , size, etc we used codes like 

background-color: light-blue;

 text-align:  center;

 color: grey; font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif "



Here are some ScreenShots of codes;

                                                                                       

                                                                                                    

Making Structured/Responsive sites with CSS

This part was rather complicated because of the attached CSS which is Cascading Style Sheet. However, I liked doing it. The first thing was to make a CSS document named style 1 . After that we were supposed to make another Document named Homepage. The idea was to link both of these pages using CSS Designer. After linking Our source code was on the homepage and the CSS code which we will use to make changes in Div was in Style1. The aim was to Add division to our webpage so it looks more Aligned and clean. We added all the Div's in the source code between body tags . We were able to work on style, color, fonts, alignment, etc. After that, I gained a little confidence so I was following the provided pdf. In which there was everything we were supposed to do and learn. After Creating a basic layout. We just had to add images name some buttons. Write headings and sub-headings include some working Hyperlinks. Which was very easy according to me. Though I faced some problems with spaces and software. It was all good. We also Added a preset called Imagerollover in which the image changes when we hover over the cursor above that image. After Finishing up. I was very satisfied because this work needs a logical mind to understand it and make work out of it.

We used codes; 

<div> This is a divider box for use in your layout </div>
<img src="yourPicture.jpg" width="300" height ="300" alt="A picture of something”>
 <a href="www.your-hyperlink.com"> The text for your link goes here </a>
 <button>Text for a button symbol</button>

The CSS codes were like ; 

contentHolder {
 position: absolute;
 height: 350px;
 width: 800px;
 left: 10px;
 top: 280px;
 }


                                              (The image of working code and live feed of code)

                                                              








Comments

Post a Comment

Popular posts from this blog

Degree Project Ideas......

Image
Thus, the summer is over and school has resumed. Do you know what you're going to make for your degree project? was the first query. I remained silent, but I knew exactly what I wanted to try and create. The entire summer, I had in the back of my mind what I ought to cook. However, I was clear on VR after receiving really favourable feedback. I was ready to work over my comfort zone in VR and create a work of art that would wow viewers. INSPIRATION  I have watched more films this summer than I ever have. I was really interested in producing films. I was curious about the work of great directors like James Cameron, Steven Spielberg, Quentin Tarantino, James Gunn, and Christopher Nolan. What makes their films so unique and how do they think? I spent the entire summer watching and analysing the majority of the films by the aforementioned directors since I was so curious. It amazed me. By the end of the summer, I was certain that I wanted to be a filmmaker and director. I also watched
Read more

Making of the Planets..

Image
In addition to creating planets for my project, I also wanted to create a template for the planets so that I could copy and paste them, changing the material and colour nodes to create a completely different planet. This way, I could use the template as often as necessary to create a bizarre planet for my degree project. First Step: Configuring the Sphere We start our journey by constructing a basic spherical, which will serve as the basis for our magnificent planet. To ensure seamless transitions and accurate detailing, we'll add a UV Sphere primitive and use Blender's user-friendly interface to polish its edges with a Subdivision Surface modifier. Step 2: Materials Addition: Enlivening the Planets Now that our sphere is in position, it's time to harness the magic of materials to give it life. We'll explore Blender's material editor and use the adaptable Musgrave texture to create an aesthetically appealing surface. Through the manipulation of characteristics li
Read more

The Davinci Result and Part 1 Post Production

Image
 While working on a certain nebulae sequence, I encountered a big obstacle in my attempt to provide engaging VR material. I tried my hardest, but there was a lot of distracting noise in the footage, which took away from the intended visual effect. I set out on a quest of investigation and testing to save the sequence and improve its quality because I was determined to find a solution. I found a potentially effective solution after researching other options and talking to other creators. DaVinci Resolve is a potent video editing programme that is well-known for its strong noise-reduction features. Equipped with this fresh understanding, I enthusiastically tested this method in the hopes of reviving my problematic nebula sequence. I nervously awaited the best outcome when I applied the denoising algorithm in DaVinci Resolve after importing the video and carefully tweaking the settings. I was astounded to see the nebulae's actual beauty emerge as the noise progressively subsided and
Read more