https://github.com/nishalnt/html_css_js
https://github.com/nishalnt/html_css_js
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/nishalnt/html_css_js
- Owner: NishalNT
- Created: 2024-09-14T16:07:38.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2024-09-26T03:27:04.000Z (8 months ago)
- Last Synced: 2025-01-10T00:18:03.882Z (5 months ago)
- Language: HTML
- Size: 25.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# HTML_CSS_JS
## Flex-Box
### index.html
```bash
Document
1
2
3
4
5
```
### style.css
```bash
.box{
flex: 1 1 calc(50% - 20px);
width: 300px;
height: 200px;
border: 2px solid blue;
background-color: lightblue;
display: flex;
font-size: 30px;
align-items: center;
justify-content: center;
}
.container{
display: flex;
gap: 20px;
flex-wrap: wrap;
}
.box:nth-child(2){
background-color: red;
/* flex-basis: 200px; */
}
@media (max-width: 720px) {
.box{
flex: 1 1 calc(100% - 20px);
}
}
```
### Simple javascript question
```bash
let a = 10;
let b = 20;
let str = "The output is:" + a + b; // this code will give the output as "The output is:1020"
console.log(str);
```
### Onkeyup.html
```bash
Document
function clicked(event){
// var key = event.key;
document.getElementById("msg").textContent = document.getElementById("show").value;
}
```
## Basic HTML Tags 👨💻👨💻👨💻
| **Tag** | **Description** |
|---------------|--------------------------------------------------------------------|
| `` | Defines the root of an HTML document |
| `` | Contains metadata/information for the document |
| `` | Sets the title of the document (shown in browser's title bar) |
| `` | Contains the visible page content |
| `
to `| Defines HTML headings from largest (``) to smallest (``) |
| `
` | Defines a paragraph |
| `
` | Inserts a line break |
| `
` | Inserts a horizontal rule (line) |
| `` | Defines a hyperlink |
| `![]()
` | Embeds an image |
| `` | Defines an unordered (bulleted) list |
| `` | Defines an ordered (numbered) list |
| `- ` | Defines a list item |
| `` | Defines a division or section in an HTML document |
| `` | Defines a table |
| `` | Defines a row in a table |
| `` | Defines a header cell in a table |
| `` | Defines a data cell in a table |
| `` | Defines a form for user input |
| `` | Defines an input field |
| `` | Defines a clickable button |
| `` | Defines a label for an input element |
| `` | Defines important text (typically bold) |
| `` | Defines bold text |
| `` | Defines italic text |
| `` | Defines a client-side script (e.g., JavaScript) |
| `<link>` | Defines a link to an external resource (e.g., CSS file) |