mirror of
https://github.com/TronoSfera/Homework.git
synced 2026-05-18 18:13:44 +03:00
Merge e9924347a3 into 1e434ad392
This commit is contained in:
commit
e7896bc68f
3 changed files with 135 additions and 0 deletions
7
1-html-css/homework1/global.css
Normal file
7
1-html-css/homework1/global.css
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
.bold {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.italic {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
71
1-html-css/homework1/index.html
Normal file
71
1-html-css/homework1/index.html
Normal file
|
|
@ -0,0 +1,71 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<link rel="stylesheet" href="global.css" />
|
||||||
|
<link rel="stylesheet" href="style.css" />
|
||||||
|
<title>Code lessons</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<ul class="m_menu">
|
||||||
|
<li>
|
||||||
|
<a href="#" class="m_menu_link">Главная</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" class="m_menu_link">Отзывы</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" class="m_menu_link">Контакты</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div class="Header"><a href="#">Отзывы</a></div>
|
||||||
|
<h1>Code Lessons</h1>
|
||||||
|
<ul>
|
||||||
|
<li>HTML + CSS</li>
|
||||||
|
<li>JavaScript</li>
|
||||||
|
<li>TypeScript</li>
|
||||||
|
</ul>
|
||||||
|
<div>
|
||||||
|
<div class="Project">
|
||||||
|
<span class="s_project">Лендинг</span>
|
||||||
|
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Cumque, natus aut soluta dicta rem iste officia laborum fugit tenetur, esse, nulla sed repellat eaque explicabo possimus. Nam incidunt quod nisi.</p>
|
||||||
|
</div>
|
||||||
|
<div class="Project">
|
||||||
|
<span class="s_project">Визитка</span>
|
||||||
|
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Adipisci consectetur cumque optio! Sequi laborum dolores, officia quaerat odit at pariatur! Iste eum sed in accusamus, nesciunt saepe ex. Dicta, velit!</p>
|
||||||
|
</div>
|
||||||
|
<div class="Project">
|
||||||
|
<span class="s_project">Учетная книга заказов</span>
|
||||||
|
<p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates amet esse neque eveniet eligendi at alias temporibus! Sapiente officiis reprehenderit, deleniti magni mollitia, quaerat perferendis tempora in quis nesciunt alias?</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<h2>First HTML + CSS</h2>
|
||||||
|
<p>
|
||||||
|
<span class="bold">HyperText Markup Language</span> or HTML is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as
|
||||||
|
<span class="bold">Cascading Style Sheets (CSS)</span> and scripting languages such as JavaScript. Web browsers receive HTML documents from a web server or from local storage and render the documents into multimedia web pages. HTML describes the
|
||||||
|
structure of a web page semantically and originally included cues for the appearance of the document. HTML elements are the building blocks of HTML pages. With HTML constructs, images and other objects such as interactive forms may be embedded
|
||||||
|
into the rendered page.
|
||||||
|
</p>
|
||||||
|
<hr />
|
||||||
|
<h2>Second JavaScript</h2>
|
||||||
|
<p>
|
||||||
|
<span class="bold">JavaScript</span>, often abbreviated as JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS. As of 2022, 98% of websites use JavaScript on the client side for webpage
|
||||||
|
behavior, often incorporating third-party libraries. <span class="italic">All major web browsers</span> have a dedicated JavaScript engine to execute the code on users' devices. JavaScript is a high-level, often just-in-time compiled language
|
||||||
|
that conforms to the ECMAScript
|
||||||
|
</p>
|
||||||
|
<hr />
|
||||||
|
<h2>Third TypeScript</h2>
|
||||||
|
<p>
|
||||||
|
<span class="bold">TypeScript</span> adds additional syntax to JavaScript to support a tighter integration with your editor. Catch errors early in your editor. TypeScript code converts to JavaScript, <span class="italic">which runs anywhere</span> JavaScript runs: In a browser, on Node.js or Deno and in your apps. TypeScript understands JavaScript and uses type inference to give you great tooling without additional code.
|
||||||
|
</p>
|
||||||
|
<hr />
|
||||||
|
<div>
|
||||||
|
<p class="footer">© All rights reserved. 2023</p>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
57
1-html-css/homework1/style.css
Normal file
57
1-html-css/homework1/style.css
Normal file
|
|
@ -0,0 +1,57 @@
|
||||||
|
.footer {
|
||||||
|
text-align: center;
|
||||||
|
color: #777;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
a,
|
||||||
|
a:link {
|
||||||
|
color: blue;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:visited {
|
||||||
|
color: blueviolet;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:active,
|
||||||
|
a:focus {
|
||||||
|
color: orangered;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_menu li {
|
||||||
|
display: inline;
|
||||||
|
margin-left: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
padding-left: 5px;
|
||||||
|
padding-right: 5px;
|
||||||
|
white-space: nowrap;
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_menu a:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
color: rgb(110, 145, 57);
|
||||||
|
}
|
||||||
|
|
||||||
|
.Project {
|
||||||
|
margin-top: 5px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-left: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
padding: 5px;
|
||||||
|
border: blue solid 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.s_project {
|
||||||
|
margin-left: 5px;
|
||||||
|
margin-right: 5px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue