HTML-specifikationen - Overholder i den?

[thj01]

Med CSS3 bliver det også efterhånden muligt at lave grafik på siderne, som før krævede mange forskellige billedfiler. F.eks. runde hjørner på bokse og effekter.

Selv menuer bliver integreret i HTML5 efterhånden - i en sådan grad at JS ikke skal anvendes til de mest almindelige opgaver. F.eks. bliver menuen, så de kan udfoldes.

Det bliver skønt at kunne programmere tekst og almindeligt indhold bare med HTML5 og CSS

Mit største problem med HTML5 har været at det ikke mere er tilladt at bruge højde og bredde på billeder med %-værdier, men kun i pixels. Det gør det ret bøvlet at designe sider, der skal kunne bruges på både telefoner, tablets og skærme.
MEN... der vil de rigtig hardcore hjemmesideudviklere bare sige at det fixes gennem CSS

[AJenbo]

Min header var i forvejen i en separat fil, så jeg skulle bare tilføje <?php include(" styles.css "); ?> til den, så var der css på hele siden

Det er betydelig bedre at bruge HTML funktionen til at pege på css filen:

Kode: Vælg alt

<link href="styles.css" rel="stylesheet" type="text/css" media="screen">

På den måde er overførslen hurtigere og der kan benyttes cache så browseren kan rendere siden en del tidligere og hurtigere.

Selv menuer bliver integreret i HTML5 efterhånden - i en sådan grad at JS ikke skal anvendes til de mest almindelige opgaver. F.eks. bliver menuen, så de kan udfoldes.

Menuen her på siden er lavet udelukkende med CSS2

[NickyThomassen]

Min header var i forvejen i en separat fil, så jeg skulle bare tilføje <?php include(" styles.css "); ?> til den, så var der css på hele siden

Det er betydelig bedre at bruge HTML funktionen til at pege på css filen:

Kode: Vælg alt

<link href="styles.css" rel="stylesheet" type="text/css" media="screen">

På den måde er overførslen hurtigere og der kan benyttes cache så browseren kan rendere siden en del tidligere og hurtigere.

Jeg havde desværre godt på fornemmelsen at <link> er bedre...
Det er et problem med Apache2, eller mere præcist, at jeg ikke kan finde ud af programmet
Hjemmesiden ligger som underside til localhost på min stationære, så jeg kan teste koden efterhånden som jeg laver den. localhost servere også min startside. Ligesom mange andre sider har jeg en mappestruktur til hjemmesiden, så for at komme ud til roden af hjemmesiden prøvede jeg at bruge

Kode: Vælg alt

<link href="../styles.css" rel="stylesheet" type="text/css" media="screen">

Og det virker også på den uploadede kode, men fordi jeg tester siden på localhost/hjemmeside, så betyder " ../styles.css " at Apache2 går helt ud til DocumentRoot og leder efter css-filen der.

Så indtil jeg finder ud af at have mere end én DocumentRoot i Apache2, så bruger jeg include() fra headeren, for styles.css og headeren ligger i samme mappe.

[thj01]

@Ajenbo

http://www.w3schools.com/html5/tryit.asp?filename=tryhtml5_menu

I dag skal en menu designes ved hjælp af <list> og en del bøvlet CSS. Når standarder er færdig vil det blive langt mere simpelt og logisk at arbejde med menuer. En gevinst programmeringsmæssigt og semantisk

[AJenbo]

<li>, but true.

[AJenbo]

Brug af include er skal være uden parentes da det er et construct og ikke en function:

Kode: Vælg alt

include 'styles.css';

Men det er også et sikkerhedsmæsigt problem at bruge den til at inkludere tekst i ens output, i stedet bør du læse filen og udskrive indholdet:

Kode: Vælg alt

echo file_get_contents('styles.css');

Mht til at få flere web roots kan du gøre det på følgende måde:
Skriv:

Kode: Vælg alt

sudo nano /etc/hosts

Tilføj:

Kode: Vælg alt

test.aptget.dk    127.0.0.1

Skriv:

Kode: Vælg alt

sudo nano /etc/apache2/sites-available/test.aptget.dk

Tilføj:

Kode: Vælg alt

<VirtualHost *:80>
   ServerName test.aptget.dk
   DocumentRoot /home/nicky/hjemmesiden
</VirtualHost>

Aktiver siden:

Kode: Vælg alt

sudo a2ensite test.aptget.dk

Så kan du se din test side ved at gå til test.aptget.dk din browser.

[NickyThomassen]

Mange tak for hjælpen, det hele virker præcis som det skal

Men det rejser endnu et par spørgsmål, som jeg håber du også har mulighed for at svare på.

Efter en tur på nettet, virker det til at PHP har 3 måder (udover require*-funktionerne) at indsætte fra filer på:
include
echo file_get_contents()
readfile()
Så vidt jeg kan se, så fortolker include filens indhold, imens file_get_contents() først indsætter indholdet i en string sammen med linebreaks ( /n), og så indsætter det. readfile() indsætter det bare.

Hvornår anbefales det at bruge de forskellige muligheder?

At bruge subdomænet test i apache er rigtig smart, det løser flere problemer, og <link href="../styles.css" rel="stylesheet" type="text/css" media="screen" /> virker endelig også lokalt. Men hvad med alle de statements som er i /etc/apache2/sites-enabled/000-default som fx Directory, ScriptAlias og ErrorLog, bliver de videregivet til /etc/apache2/sites-enabled/test.aptget.dk, eller skal man tilføje dem manuelt hvis man vil have dem?

[AJenbo]

Include/require er til når filer med php kode skal inkluderes og afvikles.

Fille_get_content er til hvis du vil arbejde med indholdet af en fil (eks. hvis du ville inkludere teksten men sikre dig der ikke var noget mystisk i den) .

Fileread() er til hvis du bare vil inkludere tekst direkte (det du gjorde).

Jeg husker ikke lige om den kun tager default fra apache config eller den også tager det fra default Site.

Det er i øvrigt bedst at bruge en absolut sti til til filen istedet for.. /styles. Css = /styles. Css

[NickyThomassen]

Det er i øvrigt bedst at bruge en absolut sti til til filen istedet for.. /styles. Css = /styles. Css

Ok, det giver også god mening. Men det ser ikke ud til at virke efter hensigten hverken 2 eller 3 mapper nede. På den anden side virker " ../ " heller ikke 3 mapper nede, der skal der bruges " ../../ " . Både readfile() og include virker ikke med:

Kode: Vælg alt

readfile("/header.php");
include "/header.php";

Strukturen er noget i retning af

Kode: Vælg alt

styles.css
header.php
index.php
underside/index.php
underside/projekt/index.php

[AJenbo]

Det er ikke i php men html du skal skrive absolutte stier til dine filer
Hvis du bruger absolutte stier i php skal de jo være ifht root på din harddisk

Det du skal skrive er:

Kode: Vælg alt

<link href="/styles.css" rel="stylesheet" type="text/css" media="screen">

[NickyThomassen]

Det er ikke i php men html du skal skrive absolutte stier til dine filer
Hvis du bruger absolutte stier i php skal de jo være ifht root på din harddisk

Ahh, selvfølgelig. Jeg tænkte slet ikke på at det kunne være anderledes i php end html...

Mange tak for hjælpen, især med Apache-delen, det havde jeg nok ikke fundet ud af lige foreløbig.

[AJenbo]

Du skal være så velkommen, jeg sider i Aarhus denne uge og sætter en ny udvikler ind i opsætningen af vores side så havde det hele liggende i finger spidserne

[NickyThomassen]

Jeg tror forresten ikke at der bliver arvet nogle statements imellem Apaches config-filer når man bruger a2ensite, for 000-default med

Kode: Vælg alt

<Directory "/usr/lib/cgi-bin">
      AllowOverride None
      Options +ExecCGI -MultiViews +SymLinksIfOwnerMatch
      Order allow,deny
      Allow from all
   </Directory>

returnere en fejl 500 når man køre

Kode: Vælg alt

localhost/cgi-bin/php?/etc/hosts

På den anden side har test.aptget.dk ingen <Directory>-statements, og den returnerer en fejl 404 hvis man prøver

Kode: Vælg alt

test.aptget.dk/cgi-bin/php?/etc/hosts

på den.
På dårligt indstillede php-systemer burde " /cgi-bin/php?/ " give adgang til root.

[thomasjohansen]

ang. css

jeg har holdt et par års pause i html og css, men for nylig gik jeg igang med at fornye intranet siden på arbejdspladsen.
Denne gang har jeg valgt wordpress, mest på grund af de mange plugins der findes til dette.

Og som altid når jeg laver sådan noget tager jeg udgangspunkt i en egnet template og modificerer den på kryds og tværs som jeg vil.

Her opdager man virkelig fordele og ulemper ved css, og hvilke "fejl" udviklerne af de templates,laver. Skal pointere at jeg nok ikke selv er bedre, da jeg ikke har sat mig 100% ind i at overholde standarder og at man tit bruger en slam løsning når bare den virker i FF og IE.
Faktisk fik jeg templaten til at spille i FF og da jeg så testede den i IE, så kunne jeg begynde forfra at rydde op i css og finde på nye krumspring.

Pointen:
På længere sigt så er css lettere at bruge end den ellers super effektive tables i tables i tables, for at få layoutet på plads. Men som i selv nævner så udgår <center> og som jeg har forstået efter en del søgen, så er der ikke en 100% afløser.
Der mangler simpelthen en "float: center". Hvorfor?

Jeg har fundet flere alternative løsninger hvor man skal lave en margin auto 0 og float left og float right mv, men hvorfor har de ikke en gyldig float center?

Og hvis der er en simpel let løsning på dette så enlighten me, please.

[AJenbo]

Hvad er et du får med center som du ikke kan få med margin auto?