Alla inlägg under maj 2013

Av Peter Johansson - 29 maj 2013 19:30

Hej alla programmeringsvänner!!


Om ni är som jag och gärna vill skriva rå kod, t.ex html eller php, javascript, css etc.


Testa Crimson editor, den är enkel att använda men har mycket bra funktioner som underlättar vid programmeringen (om man vill använda dom), den känner även igen många populära programmerings-språk och färgkodar t.ex funktioner och liknande för att underlätta.


Jag använder den själv och tycker att den är mycket bra, och nej, jag är inte sponsrad av Crimson :-).


Prova den om ni vill, den finns på http://www.crimsoneditor.com/


Happy programming!

Av Peter Johansson - 18 maj 2013 09:43

Hej igen alla programmeringsvänner, jag jobbar på ett nytt stort projekt och har därför inte tagit mig tiden att skriva här, men nu tog jag mig äntligen tid och idag tänkte jag visa er hur man använder sig av css-filer.


En css-fil är en liten textfil där du samlar dina inställningar på vilka färger, typsnitt, skuggor, boxar o.s.v som du vill använda på din webplats, sedan länkar du till css-filen från dina sidor.


Vad är då så bra med detta, undrar du kanske, Jo om du vill att t.ex överskriften på alla dina sidor ska ha ett typsnitt på 20px och färgen ska vara röd, så ställer du in detta i css-filen.

När du två veckor senare kommer på att, nämen svart vore en bättre färg på överskriften så har din webplats vuxit till ungefär 20 sidor, då istället för att behöva ändra i alla 20 sidorna ändrar du bara färg i css-filen och sim salla bim, alla sidornas överskrifter är svarta.


Du får också en "renare" html-kod (alltså den blir lättare att arbeta med och läsa) om du gömmer dina inställningar i en extern fil.


Så hur gör man då ??, jo vi kan ju ta färgexemplet, börja med att öppna en texteditor (t.ex. anteckningar) sedan skriver du in följande kod.


h1{font-size:32px; color: DodgerBlue;}


Spara nu filen som t.ex "MinCss.css"


Och nu skapar vi html-sidan.


<html>


<head>

<link rel='stylesheet' type='text/css' href='MinCss.css'>

</head>


<body>

<h1>Min fina överskrift</h1>

</body>


</html>


Som du ser så länkar vi till css-filen med koden <link rel='stylesheet' type='text/css' href='MinCss.css'>, den ska ligga mellan <head> och </head>, sedan sätter du att överskriften ska få dessa egenskaper med taggen <h1>, då kommer i detta fallet texten "Min fina överskrift" att vara blå och 32px stor.


Prova nu att ändra DodgerBlue till Black och sim salla bim, överskriften är svart.


Fortsättning följer.


Ha dé

Av Peter Johansson - 7 maj 2013 17:45

Hej alla programmeringsvänner, igår och idag har det inte blivit så långa stunder vid datorn eftersom vädret har varit helt fantastiskt för en soldyrkande nordbo   .


Igår nådde vi i Örebro ca 18 grader varmt och idag har vi just nu 21 grader varmt (i skuggan), så idag sitter jag i solstolen och bara njuter.


Jag tar snart nya tag, men nu ska jag gå ut i solen igen    , Ha dé... //Peter



Av Peter Johansson - 4 maj 2013 09:09

Idag tänkte jag tipsa om taggen <DIV>.


Många använder tabeller för att dela in en webbsida, DIV kan också användas till att dela in en webbsida (och mycket mer), dessutom kan du med DIV ange på pixeln var du vill ha din ruta (cell).


Nedan ser du ett exempel med 2 rutor (celler) som är fritt placerade på skärmen, koden för att skapa detta finns under bilden.


Enkelt förklarat fungerar det som så att man skapar först en yttre DIV (som i detta fallet kan jämföras med tabellen), den heter #topbox i mitt exempel och skapas så här <div id='topbox'></div>.


Sedan skapar man nya DIVs som man lägger in i den yttre (som då kan jämföras med cellerna i tabellen), dess heter #topcontent1 och #topcontent2 i mitt exempel och dom placeras innanför <div id='topbox></div>.

Det gör man så här <div id='topcontent1'></div>.


För att bestämma en DIVs egenskap använder man sig av <style> på följande sätt.

<style>

#topcontent1

{

}

</style>


Stylesheets kan med fördel läggas i en egen css-fil och länkas in i olika sidor, men det går vi igenom en annan dag.


Innanför klamrarna { } sätter du egenskaperna för den DIVen, t.ex width,height,left,top o.s.v


Lek lite med koden nedan (den är bara att klippa ut och klistra in), testa t.ex att ändra på värdena left och top för att flytta en "cell".







---------------------------------------------------------------------------------------------------------------------------   


<html>
<head>

<style>
#topbox
{
width:1000px;
height:800px;
position:relative;
}
#topcontent1
{
background-color:#ffffff;
position:absolute;
top:5px;
left:5px;
width:100px;
height:90px;
text-align:left;
}
#topcontent2
{
background-color:#ffffff;
position:absolute;
top:300px;
left:400px;
width:100px;
height:50px;
text-align:left;
}
</style>

</head>


<body>

<div id='topbox'>
<div id='topcontent1'>
Detta är 1
</div>
<div id='topcontent2'>
Detta är 2
</div>
</div>
</body>

</html>


---------------------------------------------------------------------------------------------------------------------


Fortsättning följer //Peter

Tidigare månad - Senare månad

Presentation

Hej! Kul att du hittade hit, Peter heter jag och jag älskar programmering, mitt största projekt ännu så länge är LBSystems Orderadministration, som är ett affärssystem i molnet. Läs mer på WWW.LBSYSTEMS.SE

Fråga mig

0 besvarade frågor

Kalender

Ti On To Fr
   
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<<< Maj 2013
>>>

Sök i bloggen

Senaste inläggen

Kategorier

Arkiv

RSS

Besöksstatistik


Ovido - Quiz & Flashcards