Updated: Wednesday, October 18,2023-10-18 15:11:13
parent
0d629c852d
commit
1c6e3cd616
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"recentFiles": [
|
||||
{
|
||||
"basename": "HTML Group Project",
|
||||
"path": "HTML Group Project.md"
|
||||
"basename": "HTML & CSS Tricks",
|
||||
"path": "HTML & CSS Tricks.md"
|
||||
},
|
||||
{
|
||||
"basename": "HTML Tricks Part 2",
|
||||
"path": "HTML Tricks Part 2.md"
|
||||
"basename": "HTML Group Project",
|
||||
"path": "HTML Group Project.md"
|
||||
},
|
||||
{
|
||||
"basename": "Potentiometers & Analog SerialReader",
|
||||
|
|
|
@ -21,7 +21,7 @@
|
|||
"state": {
|
||||
"type": "markdown",
|
||||
"state": {
|
||||
"file": "HTML Tricks Part 2.md",
|
||||
"file": "HTML & CSS Tricks.md",
|
||||
"mode": "source",
|
||||
"source": false
|
||||
}
|
||||
|
@ -41,14 +41,22 @@
|
|||
"state": {
|
||||
"type": "markdown",
|
||||
"state": {
|
||||
"file": "HTML Group Project.md",
|
||||
"file": "HTML & CSS Tricks.md",
|
||||
"mode": "source",
|
||||
"source": false
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "0dd4a19ebbb7cf04",
|
||||
"type": "leaf",
|
||||
"state": {
|
||||
"type": "empty",
|
||||
"state": {}
|
||||
}
|
||||
}
|
||||
],
|
||||
"currentTab": 3
|
||||
"currentTab": 4
|
||||
}
|
||||
],
|
||||
"direction": "vertical"
|
||||
|
@ -85,7 +93,7 @@
|
|||
"state": {
|
||||
"type": "search",
|
||||
"state": {
|
||||
"query": "windte",
|
||||
"query": "tag:#this",
|
||||
"matchingCase": false,
|
||||
"explainSearch": false,
|
||||
"collapseAll": false,
|
||||
|
@ -103,7 +111,7 @@
|
|||
}
|
||||
}
|
||||
],
|
||||
"currentTab": 1
|
||||
"currentTab": 2
|
||||
}
|
||||
],
|
||||
"direction": "horizontal",
|
||||
|
@ -123,7 +131,6 @@
|
|||
"state": {
|
||||
"type": "backlink",
|
||||
"state": {
|
||||
"file": "HTML Group Project.md",
|
||||
"collapseAll": false,
|
||||
"extraContext": false,
|
||||
"sortOrder": "alphabetical",
|
||||
|
@ -140,7 +147,6 @@
|
|||
"state": {
|
||||
"type": "outgoing-link",
|
||||
"state": {
|
||||
"file": "HTML Group Project.md",
|
||||
"linksCollapsed": false,
|
||||
"unlinkedCollapsed": true
|
||||
}
|
||||
|
@ -162,9 +168,7 @@
|
|||
"type": "leaf",
|
||||
"state": {
|
||||
"type": "outline",
|
||||
"state": {
|
||||
"file": "HTML Group Project.md"
|
||||
}
|
||||
"state": {}
|
||||
}
|
||||
}
|
||||
]
|
||||
|
@ -190,9 +194,9 @@
|
|||
"obsidian-excalidraw-plugin:Create new drawing": false
|
||||
}
|
||||
},
|
||||
"active": "43175014d1650e7c",
|
||||
"active": "0dd4a19ebbb7cf04",
|
||||
"lastOpenFiles": [
|
||||
"HTML Tricks Part 2.md",
|
||||
"HTML & CSS Tricks.md",
|
||||
"HTML Group Project.md",
|
||||
"Excalidraw/Drawing 2023-10-17 18.01.00.excalidraw.md",
|
||||
"Excalidraw",
|
||||
|
|
|
@ -27,20 +27,48 @@ Remember how we turned it into a web page? _quickly go over it_
|
|||
|
||||
---
|
||||
|
||||
# Changing the Background Color
|
||||
|
||||
```css
|
||||
/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
|
||||
HTML content. To learn how to do something, just try searching Google for questions like
|
||||
"how to change link color." */
|
||||
|
||||
body {
|
||||
background-color: pink;
|
||||
color: green;
|
||||
font-family: Times;
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## DESIGN CHALLENGE: WEB PROGRAMMING: HTML PT 2
|
||||
|
||||
This week we want to ✨spruce✨ up our website a bit more so that it looks like a presentable one. We will be getting in groups to present group designs. The challenge is on!
|
||||
|
||||
---
|
||||
|
||||
#### Tip - Adding an image to your site:
|
||||
|
||||
Go to google images and **right-click** on any image. You should see a "Copy Link Address" and click that. Paste it into "URL-here.jpg"
|
||||
|
||||
```
|
||||
<img src="URL_HERE.jpg"> #input image code for html
|
||||
|
||||
Hint: make sure for the Link address that it's either a .jpg or a .png format!
|
||||
|
||||
```
|
||||
|
||||
|
||||
```
|
||||
<img src="URL_HERE.jpg"
|
||||
style="width:100%;"> #this adjusts the size of the image
|
||||
style="width:100%;">
|
||||
```
|
||||
this adjusts the size of the image
|
||||
|
||||
---
|
||||
|
||||
Tip :
|
||||
|
||||
|
@ -50,6 +78,8 @@ Add a Search bar into your site
|
|||
<input type="search" name="search">
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
|
||||
Eventually CSS will be needed for multiple page creation in order to maintain consistency.
|
||||
|
||||
|
@ -70,6 +100,7 @@ Linking to different parts of your code on HTML:
|
|||
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
|
||||
Shwetha Jayaraj - all rights reserved.
|
Loading…
Reference in New Issue