Merge branch 'master' of github.com:kenotron/bootcamp
This commit is contained in:
Коммит
9d96c57df3
|
@ -3355,7 +3355,8 @@
|
|||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"aproba": {
|
||||
"version": "1.2.0",
|
||||
|
@ -3376,12 +3377,14 @@
|
|||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
|
@ -3396,17 +3399,20 @@
|
|||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
|
@ -3523,7 +3529,8 @@
|
|||
"inherits": {
|
||||
"version": "2.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
|
@ -3535,6 +3542,7 @@
|
|||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
|
@ -3549,6 +3557,7 @@
|
|||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
|
@ -3556,12 +3565,14 @@
|
|||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.3.5",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.2",
|
||||
"yallist": "^3.0.0"
|
||||
|
@ -3580,6 +3591,7 @@
|
|||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
|
@ -3660,7 +3672,8 @@
|
|||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
|
@ -3672,6 +3685,7 @@
|
|||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
|
@ -3757,7 +3771,8 @@
|
|||
"safe-buffer": {
|
||||
"version": "5.1.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
|
@ -3793,6 +3808,7 @@
|
|||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
|
@ -3812,6 +3828,7 @@
|
|||
"version": "3.0.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
}
|
||||
|
@ -3855,12 +3872,14 @@
|
|||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"yallist": {
|
||||
"version": "3.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
|
@ -1,29 +1,31 @@
|
|||
/* https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Combinators_and_multiple_selectors */
|
||||
|
||||
/* Targeting an HTML tag */
|
||||
h1 {
|
||||
padding: 10px;
|
||||
margin-bottom: 15px;
|
||||
margin-top: 15px;
|
||||
color: black;
|
||||
background: #ddd;
|
||||
border: 1px solid #ababab;
|
||||
margin-bottom: 15px;
|
||||
margin-top: 15px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
a:hover {
|
||||
color: #ccc;
|
||||
/* Overriding inherited styles */
|
||||
span {
|
||||
color: #004578;
|
||||
}
|
||||
|
||||
/* Targeting a class name */
|
||||
.tiles {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* Decendant selector */
|
||||
.tiles img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 75%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Direct decendant selector */
|
||||
.tiles > div {
|
||||
background: rgb(10, 10, 10);
|
||||
color: white;
|
||||
|
@ -32,18 +34,38 @@ a:hover {
|
|||
margin-right: 20px;
|
||||
}
|
||||
|
||||
/* Qualified selector */
|
||||
div.links {
|
||||
background: #004578;
|
||||
}
|
||||
|
||||
/* Style inheritance only works for unstyled elements */
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Pseudo hover selector */
|
||||
a:hover {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
/* Sibling selectors */
|
||||
a ~ a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Positional Pseudo Selectors */
|
||||
.tiles > div:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
a + a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#contact-form > * {
|
||||
/* ID and selector lists */
|
||||
#contact-form label,
|
||||
#contact-form input {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Attribute selector */
|
||||
input[type='submit'] {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<div>
|
||||
<h1>This is my <span>Title</span></h1>
|
||||
<div class="tiles">
|
||||
<div>
|
||||
<div class="links">
|
||||
<h2>Important Links</h2>
|
||||
<a href="#">We're Awesome</a>
|
||||
<a href="#">Learn More</a>
|
||||
|
@ -14,14 +14,14 @@
|
|||
</div>
|
||||
<div>
|
||||
<h2>Our Logo</h2>
|
||||
<img src="./fabric.jpg" alt="fabric logo" />
|
||||
<img src="./fabric.jpg" width="100" alt="fabric logo" />
|
||||
</div>
|
||||
<div>
|
||||
<h2>Contact Us</h2>
|
||||
<form id="contact-form">
|
||||
<div id="contact-form">
|
||||
<label>Email</label><input type="email" />
|
||||
<input value="Submit" type="submit" />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Загрузка…
Ссылка в новой задаче