Forum » Programiranje » HTML in CSS v Visual Studio 2017
HTML in CSS v Visual Studio 2017
cistnov ::
Zdravo. Povsem na začetku sem z učenjem, a v Visual Stsudio ne znam povezati HTML in CSS. Bi mi lahko pomagali.
HTML sem ustvaril z File/New in izbral "HTML page". Tu mi je jasno vse. Ta je shranjena kot .html.
Za CSS pa mi ni čisto jasno, kaj moram odpreti. Poskusil sem tudi že SCSS, a trenutno imam sledeče - New/Web/Style Sheet, ki ga shranim kot .css. Celotna koda je v body. Datoteka se imenuje StyleSheet.css in je v isti mapi kot html.
Zadeva je že delovala, pa spet ne. Prosim za pomoč.
Hvala...
HTML sem ustvaril z File/New in izbral "HTML page". Tu mi je jasno vse. Ta je shranjena kot .html.
<head>
<meta charset="utf-8" />
<title>Quinoa and Kale Salad Recipe</title>
<link rel="stylesheet" type="text/css" href="./StyleSheet.css"/>
</head>
<body>
<img class="image" src="salad.jpg" alt="Kale Ceasar Salad" />
Za CSS pa mi ni čisto jasno, kaj moram odpreti. Poskusil sem tudi že SCSS, a trenutno imam sledeče - New/Web/Style Sheet, ki ga shranim kot .css. Celotna koda je v body. Datoteka se imenuje StyleSheet.css in je v isti mapi kot html.
body {
.image {
height: 500 px;
}
}
Zadeva je že delovala, pa spet ne. Prosim za pomoč.
Hvala...
- spremenilo: cistnov ()
scipascapa ::
če sta html in css v istem direktoriju tam pri href="./xxx"/>
odstrani .
https://nsa-splet.si/css/zgledi/css-zgl...
pomoje je razlog? razen če imaš to sliko salada.jpg shranjeno v svoji mapi?
pa še to imaš narobe v css
body uporabljaš v htmlu: https://www.w3schools.com/tags/tag_body...
za class="image" uporabiš
.image { vsebina }
odstrani .
https://nsa-splet.si/css/zgledi/css-zgl...
pomoje je razlog? razen če imaš to sliko salada.jpg shranjeno v svoji mapi?
pa še to imaš narobe v css
body uporabljaš v htmlu: https://www.w3schools.com/tags/tag_body...
za class="image" uporabiš
.image { vsebina }
Zgodovina sprememb…
- spremenil: scipascapa ()
HotBurek ::
Evo en sample HTML kode, z nekaj dodatki, da še malo izboljšaš zadevo:
Glede debugiranja pa v brskalniku pritisni na F12, in se ti bo odprlo t.i. Developer Tools. To nujno potrebuješ pri web razvoju za testiranje in debugiranje.
Npr. v zavihku Network se preveri, katera vsebina se ti zlouda. Tam lahko vidiš potem napake (404 response).
<!DOCTYPE html> <html lang="en"> <head> <title>title...</title> <meta name="keywords" content="keywords..."/> <meta name="description" content="description..."/> <meta name="robots" content="index,follow"/> <meta charset="utf-8"/> <link type="text/css" rel="stylesheet" href="/index.css" /> <script src="/index.js"></script> </head> <body> html body koda... </body> </html>
Glede debugiranja pa v brskalniku pritisni na F12, in se ti bo odprlo t.i. Developer Tools. To nujno potrebuješ pri web razvoju za testiranje in debugiranje.
Npr. v zavihku Network se preveri, katera vsebina se ti zlouda. Tam lahko vidiš potem napake (404 response).
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window
Stari89 ::
Morda razmisli o drugem urejevalniku kode. Visual Studio je namreč precejšen overkill za tako simpl zadevice. Morda poskusi raje Visual Studio Code, ki je trenutno zelo popularen (ampak vseeno dovolj močen za zelo napredne zadeve).
Pa kot je HotBurek predlagal, čim prej se nauči uporabljat razvijalska orodja v svojem najljubšem brskalniku.
Srečno in ne obupat! Web development je super hobi, s katerim se komot preživiš.
Pa kot je HotBurek predlagal, čim prej se nauči uporabljat razvijalska orodja v svojem najljubšem brskalniku.
Srečno in ne obupat! Web development je super hobi, s katerim se komot preživiš.
Zgodovina sprememb…
- spremenilo: Stari89 ()
cistnov ::
Sem vmes tole že davno rešil. Težava je bila v poimenovanu css-ja.
V glavnem sledim tutorialom iz Codecademy in malo poskušam v Visual Studio (naložil sem tudi Code) ter gledam Developer Tools. Tega je res ogromno in se ne znajdem. Plan imam, da bom predelal vse tutoriale iz zavihka HTML in CSS (klik), potem pa bom naredil par duplikatov že obstoječih spletnih strani. Recimo, da mi bo to ob delu vzelo še kakšen mesec.
Kasneje se bom lotil ali C# ali Javascript. S tem se v trenutni službi dela. Cilj so samostojne aplikacije, kot tudi napredne spletne strani. Pri slednjih je, kot sem zasledil, JS prisoten je v front-endu. Za C# ima Visual Studio omogočen IntelliSense, medtem, ko je za JS to le v Code. To se mi zdi za začetek precej lažje, je pa res, da sem JS nekaj že gledal.
Vse, kaj točno se dela, kaj se uporablja kot back- in kaj kot front-end ter še vse ostalo mi je zelo malo jasno. Najbolj me skrbi, da zapravljam čas in se učim zadeve, ki so že zastarele.
V glavnem sledim tutorialom iz Codecademy in malo poskušam v Visual Studio (naložil sem tudi Code) ter gledam Developer Tools. Tega je res ogromno in se ne znajdem. Plan imam, da bom predelal vse tutoriale iz zavihka HTML in CSS (klik), potem pa bom naredil par duplikatov že obstoječih spletnih strani. Recimo, da mi bo to ob delu vzelo še kakšen mesec.
Kasneje se bom lotil ali C# ali Javascript. S tem se v trenutni službi dela. Cilj so samostojne aplikacije, kot tudi napredne spletne strani. Pri slednjih je, kot sem zasledil, JS prisoten je v front-endu. Za C# ima Visual Studio omogočen IntelliSense, medtem, ko je za JS to le v Code. To se mi zdi za začetek precej lažje, je pa res, da sem JS nekaj že gledal.
Vse, kaj točno se dela, kaj se uporablja kot back- in kaj kot front-end ter še vse ostalo mi je zelo malo jasno. Najbolj me skrbi, da zapravljam čas in se učim zadeve, ki so že zastarele.
Stari89 ::
Čim prej si razčisti, katera koda laufa na clientu (front-end) in na katera serverju (back-end) ter kako poteka komunikacija pri GET in POST (ter ostalih) HTTP requestih.
Naslednji korak naj ti bo učenje front-enda. S tistim tutorialom, ki si ga nalimal, ne moreš zajebat. Temu znanju čim prej dodaj Javascript, saj teče na vseh browserjih, neke pametne alternative pa žal (še) ni.
Z back-endom bi se začel ukvarjat šele, ko bi za silo že znal HTML-CSS-JS kombinacijo. Izbira frameworka, ki ga imate na šihtu (ASP.NET Web Forms, MVC, .NET Core, ...?), bo narekovala preostale tehnologije in orodja.
Razen če ga res res res rabiš na šihtu, se ne bi ukvarjal z jQuery. Čeprav z njim lahko narediš zares vse, čeprav ti olajša veliko veliko zadev in čeprav je najbolj popularna JS knjižnica na planetu, ga novejši libi (React, Angular) konceptualno povozijo. My 2 cents.
Also za JS ne glej prestarih tutorialov. Če že uporabljajo ES6 sintakso, potem bojo že kar okej.
Naslednji korak naj ti bo učenje front-enda. S tistim tutorialom, ki si ga nalimal, ne moreš zajebat. Temu znanju čim prej dodaj Javascript, saj teče na vseh browserjih, neke pametne alternative pa žal (še) ni.
Z back-endom bi se začel ukvarjat šele, ko bi za silo že znal HTML-CSS-JS kombinacijo. Izbira frameworka, ki ga imate na šihtu (ASP.NET Web Forms, MVC, .NET Core, ...?), bo narekovala preostale tehnologije in orodja.
Razen če ga res res res rabiš na šihtu, se ne bi ukvarjal z jQuery. Čeprav z njim lahko narediš zares vse, čeprav ti olajša veliko veliko zadev in čeprav je najbolj popularna JS knjižnica na planetu, ga novejši libi (React, Angular) konceptualno povozijo. My 2 cents.
Also za JS ne glej prestarih tutorialov. Če že uporabljajo ES6 sintakso, potem bojo že kar okej.
cistnov ::
Rad bi imel tako. V "head" imam nek navbar z več zaznamki. Ko kliknem katerega od njih se v osrednjem delu prikaže vse, kar ta zaznamek zajema. Trenutno znam narediti zgolj to, da je vse na eni strani in se potem pogled pomakne nanjo.
Recimo tole: https://codepen.io/rishabhp/pen/aNXVbQ/.
Sedaj pa bi rad, da se spremeni kompletna osrednja stran ali pa recimo le del.
Kako se to naredi?
Trenutno grem po Codecademy in je moj cilj Web Developer. Pogledal sem si HTML, CSS ter Bootstrap. (https://www.codecademy.com/catalog/lang.... Manjka mi še SASS in nekaj od Responsive Designa, ki pa je bil že v CSS.
Nadaljnje je pa pod Web Development (https://www.codecademy.com/catalog/subj... tega cel kup. Kaj mi predlagate?
Recimo tole: https://codepen.io/rishabhp/pen/aNXVbQ/.
Sedaj pa bi rad, da se spremeni kompletna osrednja stran ali pa recimo le del.
Kako se to naredi?
Trenutno grem po Codecademy in je moj cilj Web Developer. Pogledal sem si HTML, CSS ter Bootstrap. (https://www.codecademy.com/catalog/lang.... Manjka mi še SASS in nekaj od Responsive Designa, ki pa je bil že v CSS.
Nadaljnje je pa pod Web Development (https://www.codecademy.com/catalog/subj... tega cel kup. Kaj mi predlagate?
kuall ::
To se naredi z jquery animations. imaš več sections (strani) na isti strani, na začetku daš vsem stil display:none in jih potem kažeš/skrivaš ob kliku na navigacijo.
jquery je ok, eden ti je rekel,da se ga ne uči ampak je nasvet neumen. samo zato , ker malo prihaja iz mode še ne pomeni, da ni zelo uporabna stvar. uporablja ga polovica vseh strani. jquery naredi js programiranje bolj prijetno. bistvo jquery-ja je, da ti je treba tipkat manj kode, zato je postal tako popularen. manj kode = good. manj govorjenja = tudi good, noben ne mara nakladačev, ne v real life ne v programiranju.
skoncentiraj se na jquery + bootstrap, če ne bi rad tratil časa.
aja še en neumen nasvet je, da prešaltaj na drug editor kot je visual studio. visual studio je najboljši, kar ostani na njem.
jquery je ok, eden ti je rekel,da se ga ne uči ampak je nasvet neumen. samo zato , ker malo prihaja iz mode še ne pomeni, da ni zelo uporabna stvar. uporablja ga polovica vseh strani. jquery naredi js programiranje bolj prijetno. bistvo jquery-ja je, da ti je treba tipkat manj kode, zato je postal tako popularen. manj kode = good. manj govorjenja = tudi good, noben ne mara nakladačev, ne v real life ne v programiranju.
skoncentiraj se na jquery + bootstrap, če ne bi rad tratil časa.
aja še en neumen nasvet je, da prešaltaj na drug editor kot je visual studio. visual studio je najboljši, kar ostani na njem.
Zgodovina sprememb…
- spremenilo: kuall ()
Vredno ogleda ...
| Tema | Ogledi | Zadnje sporočilo | |
|---|---|---|---|
| Tema | Ogledi | Zadnje sporočilo | |
| » | Nekaj vprašanj glede izdelave spletne strani.Oddelek: Izdelava spletišč | 4840 (3691) | scipascapa |
| » | Kako začeti z učenjem izdelave spletnih strani?Oddelek: Izdelava spletišč | 2358 (1754) | scipascapa |
| » | Učenje programiranja (Front-end) (strani: 1 2 )Oddelek: Programiranje | 13716 (10812) | matjash |
| » | Katero stran/tutorial priporočate za učenje programiranja?Oddelek: Programiranje | 1889 (1508) | shadeX |
| » | Front-end development in Twitter BootstrapOddelek: Izdelava spletišč | 2827 (2219) | btzajla |