cifo-training · JCJV2019 · Apr 23, 2019 · Apr 28, 2019 · Apr 28, 2019
diff --git a/css/mycss1.css b/css/mycss1.css
@@ -0,0 +1,17 @@
+body{
+    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
+}
+
+.Cuerpo{
+    background-color:rgba(210, 238, 245, 0.911) ;
+    border: black 1px solid;
+    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    padding-left: 1%;
+    padding-bottom: 1%;
+}
+
+.Warnings{
+    color: red;
+}
diff --git a/css/mycss2.css b/css/mycss2.css
@@ -0,0 +1,22 @@
+body{
+    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
+}
+
+h4 {
+    color: rgba(92, 64, 28, 0.89);
+}
+
+.Principal {
+    background-color:rgba(254, 255, 234, 0.911) ;
+    border: black 1px solid;
+    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    padding-left: 1%;
+    padding-bottom: 1%;
+}
+
+footer {
+    color: rgba(57, 231, 41, 0.911);
+    font-style: italic; 
+
+}
+
diff --git a/css/mycss3.css b/css/mycss3.css
@@ -0,0 +1,29 @@
+body{
+    font-family: Arial, sans-serif;
+}
+
+.Principal {
+    background-color:rgb(189, 230, 214) ;
+    border: black 1px solid;
+    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    color: rgb(153, 110, 58);
+
+}
+
+.Cabecera {
+    background-color: rgb(135, 149, 150);
+    font-size: 2em;
+    font-weight: bold;
+    color: white;
+    margin: 1%;
+
+}
+
+.Lista {
+    color: black;
+    line-height: 2em;
+}
+
+main {
+    padding-left: 1%;
+}
diff --git a/css/mycss4.css b/css/mycss4.css
@@ -0,0 +1,41 @@
+body{
+    font-family: Geneva, Verdana, sans-serif;
+}
+
+.Cabecera {
+    background-color: rgb(209, 180, 152);
+    font-size: 2em;
+    font-weight: bold;
+    color: rgb(68, 41, 13);
+    margin-left: 1%;
+    margin-top: 1%;
+
+}
+.Principal {
+    background-color: rgba(243, 229, 171, 0.555);
+    border: black 1px solid;
+    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+
+}
+
+h2 {
+    color: rgb(95, 66, 11);
+    font-style: italic;
+}
+
+dl {
+    line-height: 2em;
+}
+
+span {
+    font-weight: bold;
+}
+
+.Lista {
+    color: black;
+    line-height: 2em;
+}
+
+main {
+    padding-left: 1%;
+}
diff --git a/css/mycss5.css b/css/mycss5.css
@@ -0,0 +1,38 @@
+body{
+    font-family: Geneva, Verdana, sans-serif;
+}
+
+.Cabecera {
+    background-color: rgb(116, 82, 61);
+    font-size: 2em;
+    font-weight: bold;
+    color: white;
+    margin: 1%;
+
+}
+.Principal {
+    background-color: rgba(243, 229, 171, 0.555);
+    border: black 1px solid;
+    font-stretch: narrower;
+
+}
+
+h2 {
+    color: rgb(95, 66, 11);
+}
+
+.Wrong {
+    color: red;
+    font-weight: bold;
+}
+
+blockquote {
+    font-size: 80%;
+    text-align: right;
+    margin-right: 1em;
+}
+
+main {
+    padding-left: 1%;
+    font-size: 90%;
+}
diff --git a/css/mycss6.css b/css/mycss6.css
@@ -0,0 +1,14 @@
+body{
+    font-family: Geneva, Verdana, sans-serif;
+}
+
+.Principal {
+    border: black 1px solid;
+    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    padding: 10px 10px 10px 10px;
+
+}
+
+h1 {
+    margin: 0px;
+}
diff --git a/css/mycss7.css b/css/mycss7.css
@@ -0,0 +1,34 @@
+body{
+   font-family: Times, 'Times New Roman', serif;
+}
+
+.Principal {
+    border: black 1px solid;
+    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+    padding: 10px 10px 10px 10px;
+
+}
+
+h1 {
+    margin: 0px;
+}
+
+p[id] {
+    margin: 1em 1em 2em 0em;
+}
+
+#n1 {
+    text-shadow: 2px 2px 3px gray; 
+}
+
+#n2 {
+    text-shadow: 5px 4px 2px gray; 
+}
+
+#n3 {
+    text-shadow: 8px 8px 2px gray; 
+}
+
+#n4 {
+    text-shadow: 16px 14px 2px gray; 
+}
diff --git a/css/mycss8.css b/css/mycss8.css
@@ -0,0 +1,26 @@
+body{
+    font-family: Verdana, sans-serif;
+ }
+
+ .Principal {
+     border: black 1px solid;
+     box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+     padding: 10px 10px 0px 10px;
+     background-color: rgb(241, 247, 247);
+
+ }
+
+ h1 {
+     margin: 0px;
+ }
+
+ p[id] {
+    margin: 1em 1em 2em 0em;
+    width: 100%;
+    direction: rtl;
+    unicode-bidi: bidi-override;
+    text-align: left;
+    line-height: 2em;
+
+ }
+
diff --git a/index1.html b/index1.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Product Description</title>
+    <link rel="stylesheet" href="css/mycss1.css">
+</head>
+<body>
+    <div class="Cuerpo">
+        <h1>X-241 Dog Robot</h1>
+        <div>
+            <h2>Overview</h2>
+            <p>The X-241 is the perfect cannine pal for the busy billionaire.</p>
+        </div>
+
+        <div>
+            <h2>Details</h2>
+            <p>
+                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text 
+                ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. 
+                It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. 
+                It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop 
+                publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                Why do we use it?
+            </p>
+
+        </div>
+
+        <div class="Warnings">
+            <h2>Warnings</h2>
+            <p>
+                <ul>
+                    <li>Do not inmerse in water.</li>
+                    <li>Do not eat.</li>
+                    <li>Does not exist.</li>
+                </ul>
+            </p>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/index2.html b/index2.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Cats and Dogs</title>
+    <link rel="stylesheet" href="css/mycss2.css">
+</head>
+<body>
+    <div class="Principal">
+        <main>
+            <h1>Cats and Dogs</h1>
+            <div>
+                <h4>I have a cat, and am thinking of getting a dog. Will they fight?</h4>
+            </div>
+
+            <div>
+                <p>
+                    The idea that dogs hate cats may have born because dogs chase cats and grew because cartoons depicted ongoing battles between the two species.
+                    Or it may have been generated because some dog people strongly dislike cats and some cat people disdain dogs. 
+                    However, dogs and cats can live peaceablye as long as owners understand the behaviors of each.
+                </p>
+
+                <p>
+                    In some cases, a resident cat will isolate itself when a puppy is added to the family.
+                    I other cases, cats and dogs never get used to each other.
+                    In still other cases, cat or kitten and dog or puppy play together and build a friendship that finds them curled up together in a create o bed and drinking out of the same bowl.
+                    The type of relationship developed in each household depends on the personality of the animals and the understanding of the owners.
+                </p>
+
+            </div>
+        </main>
+
+        <footer>
+            <p>
+                [From Dog Owner's Guide: Fighting furry furies? (www.canismajor.com/dog/furfury.html)]
+            </p>
+        </footer>
+    </div>
+</body>
+</html>
diff --git a/index3.html b/index3.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Metaphor</title>
+    <link rel="stylesheet" href="css/mycss3.css">
+</head>
+<body>
+    <div class="Principal">
+        <header>
+            <div class="Cabecera">
+                Metaphor
+            </div>
+        </header>
+
+        <main>
+            <p>
+                A metaphor is a mapping from one domain to another. 
+                For example, moo is to cow as beep is to car.
+                These mappings get so buried in our language that we don't even notice their effects.
+            </p>
+            <p>
+                For example, take the language used to describe a debate:
+            </p>
+            <div class="Lista">
+                <dl>
+                    <dd>"He shot down her ideas."</dd>
+                    <dd>"She defended her position."</dd>
+                    <dd>"She overwhelmed his arguments."</dd>
+                    <dd>"He had to retreat from that position."</dd>
+                </dl>
+            </div>
+            <p>
+                These are all debate-as-war metaphors.
+                It's a zero sum game.
+                Someone wins and someone loses.
+                The idea that both people could learn from each other just doesn't come up.
+            </p>
+        </main>
+    </div>
+</body>
+</html>