Recap of Web Engineering...

-

Well, one of my hobbies is to write HTML and CSS. So I thought to type some code and share that in this blog post.

 so here you go..

 CODE:
"ForEnjoyment.html" file

 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <link type="text/css" rel="stylesheet" href="styleSheet.css">
    <title>Just for Fun</title>
</head>
<body>

   <div class="a">

       <div class="e">
           <div class="f">

           </div>  <div class="a">

           <div class="b">

               <div class="c">

                   <div class="d">

                   </div>

               </div>
           </div><div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
       </div>

       <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div><div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
   </div>
<div class="e">
    <div class="f">

    </div>  <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div><div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
   </div>
<div class="e">
    <div class="f">

    </div>  <div class="a">

       <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div><div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
   </div>
<div class="e">
    <div class="f">

    </div> <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
   </div>
<div class="e">
    <div class="f">

    </div> <div class="a">

       <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
   </div><div class="a">

       <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div>
       </div>
</div></div>
<div class="e">
    <div class="f">

    </div> <div class="a">

       <div class="b">

           <div class="c">

               <div class="d">

               </div>

           </div></div>
       </div></div>
</div></div>
<div class="e">
    <div class="f">

    </div>
</div>
</body>
</html>


styleSheet.css file code:
body{


    background-image: linear-gradient(to right, yellow,red, yellow);

}
.a{
    border: 10px solid black;
    box-shadow: 2px 3px 5px gray;
    border-radius: 25% 50% 25%;
    background-image: linear-gradient(to right, black , blue, gold);


}

.b{
    border:8px solid red;
    padding:20px;
    margin:40px;
    border-radius: 25% 50%;
    box-shadow: 2px 3px 5px gray;
    background-image: linear-gradient(to right, black , pink, yellow);
}

.c{
    border:10px solid blue;
    padding: 10px;
    box-shadow: 5px 5px 5px gray;
    border-radius: 50% 25%;
    background-color: cornflowerblue;
}

.d{
    border:9px solid olivedrab;
    padding: 40px;
    border-top-right-radius: 50%;
    box-shadow: 3px 3px 5px gray;
    background-color: gainsboro;
}

.e{
    border: 10px solid midnightblue;
    padding: 30px;
    margin: 20px;
    box-shadow: 2px 3px 5px gray;
    border-radius: 50% 25% 50%;
    background-color: yellowgreen;
}

.f{
    border:9px solid greenyellow;
    border-radius: 10% 30% 40% 50%;
    padding:60px;
    margin: 20px;
    box-shadow: 2px 3px 5px gray;
    background-color: mediumseagreen;
}






OUTPUT:

Happy coding :)

Comments

Post a Comment

Popular posts from this blog

Relational Data Model

-
Image
In the previous blog post, we covered Data Modeling. We have seen that data modeling is really important before jumping into predictive modeling.  In this article, we will cover the Relational Data Model (RDM). Let's start from the very basics, relational means anything which is linked with some other thing. This link is called "Relationship". In RDM or RM there are major three types of relationship cardinalities (also called Multiplicities or Cardianalities): 1. One to one 2. One to many 3. Many to many We can understand these with the help of a few simple examples;  One to one: One department has one manager. One to many: One class has many students. Many to many: Many teachers can teach many students. Okay, so we have got an abstract overview of the term " Relational ", now the next thing is " Data ", data covers everything, anything... And finally, " Model " means something in the form of a template, design, a kind of blueprint.  To store...
Read more

An Interview with Pakistani Data Scientist : Dr. Zeeshan Ul Hassan Usmani

-
Image
Dr. Zeeshan-ul-Hassan Usmani, the name known for Data Science, Predictify me, Eisenhower fellowship  and most importantly motivation for many of the students. He is the Author of book like  (C++) ++سی/سی ,  Bit Coin Block Chain aur Crypto Currency بٹ کوائن، بلاک چین اور کرپٹو کرنسی  and many other, you can visit them here . Today "Data Science Tales - A Tech blog by Bia Chaudhry," asked him some of the questions, as an interview and we are very glad that he gave his precious time to answer them. It was kinda "Remote Interview"... not the traditional one.. The Interview Question:  How can you describe " Dr. Zeeshan ul Hassan Usmani " ? ANSWER: I am a shameless idealist. We are all idealists at some stage of our lives but then it fades away and we live as a mediocre. I don’t want it to fade away. I remind myself almost every day that I need to make my today better than my yesterday, and the challenge is keep getting harder J . We onl...
Read more

Data Engineering Tools

-
Image
   Data is a new oil. To channelize this data we need proper pipelines. These pipelines are mostly called ETL or data pipelines.  There are various tools out there to work out these Extract, Transform, and Load (ETL) operations.  Some of the scripting tools are:  - Python - SQL and NoSQL Apache provides a wide range of products that can be used as Data Engineering tools.  Some of the amazing apache DE services comprised of; - Hadoop - Spark - Kafka - Cassandra - Hive In addition, some cool DE tools are: - Tableau - Talend - MapReduce These DE tools provide a way to manage the data pipelines in a more effective, efficient, and better way.  Almost every Data-Oriented company in the corporate sector is highly dependent upon these technologies. They are leveraging many of the above-mentioned mechanisms for promising Data Services and Architecture. That's it for today. Hope you have enjoyed this article. If you want to know more about data or software relat...
Read more

Applications of Data Engineering

-
Image
In a previous blog post about data engineering, we went through several many concepts related to data engineering such as data modeling, and then we went through different types of databases, for example, relational databases and we also got a glimpse of relational as well as NoSQL databases. And in today's blog post we will be writing about data engineer applications. Which are basically the use cases of data engineering 1st let's see what data engineering applications mean; so basically when we have data and we have engineered it then there are several things that we can do with that data and these things that we can do with processed data are the use cases of the data engineering. For example: If we have filled our containers with the data then it's not of any good use if it is not clean and well-formed. If your data is well-formed and if there are no logical mistakes, missing values, and garbage then we can easily perform the use cases and applications of data enginee...
Read more

Five People to Follow on Social Media

-
Image
How many times you used to scroll Facebook, Instagram, Twitter, and other social media platforms? You always want to make your scrolling productive but after 2-3 hours you realize that you have wasted tons of your precious time.  so, if you want to make the best use of your social media time, then you can follow the following people, their posts are meant to give some worthy information. let's get started: Hisham Sarwar  Follow Hisham Sarwar for freelancing related information. Zeeshan Ul Hassan Usmani  Follow Zeeshan Ul Hassan Usmani for data science, artificial intelligence and, block-chain related stuff. Aman Dhattarwal  Follow Aman Dhattarwal for study and placement tips and tricks. Sandeep Maheshwari  Follow Sandeep Maheshwari for business strategies and motivational content. Qasim Ali Shah  Follow Qasim Ali Shah for study motivation as well as life lessons. Enjoy!
Read more

Data Science : The Fusion Reaction

-
Image
“ Data is the new oil? No: Data is the new soil. ”          ~ David McCandless These days plethora of new things are coming like: "Naya Pakistan" , "Naya prime-minister" , "Naya Semester" and the list goes on... but Let's just talk about this "new soil" science that is "Data Science " Data Science is made up of two words: Data and Science.  Data is a Latin word and a plural of  datum, meaning "thing" It is first used in English in 1640's (17th Century ).  Science came from Latin too, it is derived from a Latin word "scientia" meaning knowledge . Then the old French said : "Hey, I don't like "scientia" let's call it "escience" or just forget about "e" in the beginning and say it: "science" " . Then an English came and said : "I order you to take this word as "science" and no more debate on this !" ...
Read more

Elasticsearch and Redis : NoSql

-
Image
The colorful  bubble logo  is of Elasticsearch , while the redish logo is of Redis . First let's talk about Elastic search.. Elasticsearch is an open source search engine. Now, what is a search engine? Search engine is basically a website, for example: google.com, yahoo.com, bing and MSN. What we look as Google chrome, Safari or Internet Explorer is basically a Web browser. Let's say we type "www.facebook.com" in a web browser's address bar , then the web browser will take us directly to the website "facebook.com". As for search engine, if we type in its search bar , "www.facebook.com", then it will open up different links according to the search algorithm. So Elasticsearch is like a search engine. But it is different from traditional search engines. Like in most of the search engines, tables are used to store data, while elasticsearch is no schema based search engine. In place of tables, JSON documents are used in Elasticsearch. I...
Read more

Web Scraping : Urdu News

-
Image
Web scraping is an amazing method to collect data. Many data scientist use this method. I have scrape Urdu news . Urdu is difficult to scrape but thanks to Python and its libraries. Have a look at the code and outputs below:
Read more