|
|
 | KOMPOZER – BOKS
Fra :  EA_HS  | Vist : 1156 gange
500 point
Dato : 25-06-09 15:44 |
| | |
 | Kommentar
Fra : ajohansen |
Dato : 25-06-09 15:49 |
|
er det <iframe> du tænker på
//ajohansen
| |
 | Kommentar
Fra : Eyvind |
Dato : 25-06-09 16:02 |
| | |
 | Kommentar
Fra : molokyle |
Dato : 25-06-09 19:23 |
| | |
| Kommentar
Fra : molokyle |
Dato : 25-06-09 19:30 |
|
Ps. Iøvrigt kan vi ik' rigtigt bruge dine link til 'noget' ...det er jo serveside kode i PHP og ta'r derfor en tur omkring serverens parser ...FØR klientkildekoden i (X-)HTML, Javascript osv., når os alm. dødelige brugere 
Vi kan KUN se den kode serveren har genereret på baggrund af PHP koden.
Dine stylesheets finder du hér: http://kimludvigsen.dk/style/ludvigs.css
Kode
html, body, .venstre, .venstremenu, .midt, .faktaboks, .smalfaktaboks, .faktaboksright {
height: 100%;
}
body, .topbar, .midt, .oversigt, .kategorier1, .kategorier2, input, textarea, a.menuoverskrift, a.tekstlink, a.tekstlinkher {
color:rgb(0,0,0);
background-color: rgb(255,255,255);
}
body {
margin: 5px;
padding: 0px;
background-image: url(../billeder/baggrund.jpg);
text-align: center;
}
.side {
width: 770px;
position:relative;
top: 0px;
margin-left: auto;
margin-right: auto;
text-align: left;
font-family: helvetica,arial,sans-serif;
}
.topbar {
border-style: solid solid none;
border-color: rgb(74,74,74);
border-width: 2px 2px medium;
background: url(../billeder/logo.gif) repeat scroll 0%;
position: relative;
top: 0px;
height: 80px;
width: 761px;
z-index:20;
}
.reklame {
position: relative;
float: left;
top: 10px;
left: 40px;
width: 500px;
height: 60px;
z-index:20;
}
.menu {
border-style: none solid solid;
border-color: rgb(74,74,74);
border-width: medium 2px 2px;
background: rgb(74, 74, 74) none repeat scroll 0%;
color: rgb(255, 255, 255);
position: relative;
top: 0px;
left: 0px;
height: 25px;
width: 761px;
z-index:20;
}
.fastmenu {
border-style: none;
color: rgb(255,255,255);
position: fixed;
top:0px;
background: rgb(74,74,74) url(../billeder/logo3.png);
height:32px;
width: 763px;
z-index:10;
margin-left: auto;
margin-right: auto;
padding-left:2px;
padding-top:5px;
}
.indpakning {
position: relative;
padding:0px;
top:5px;
width: 768px;
background-image: url(../billeder/bagindpakning.png);
background-repeat: repeat-y;
}
.venstre {
border: 2px solid rgb(74,74,74);
border-bottom: 0px;
padding: 2px;
background: rgb(161,192,224);
float: left;
position: relative;
top: 0px;
padding-top: 5px;
width: 146px;
color: rgb(0,0,0);
z-index:8;
}
.venstremenu {
border: 2px solid rgb(255,255,204);
padding: 0px;
background: rgb(255,255,204);
position: relative;
top: 5px;
left: 5px;
width: 133px;
color: rgb(0,0,0);
}
.venstremenu a {
padding-left:0px;
margin-left:2px;
}
.midt {
border: 2px solid rgb(74,74,74);
border-bottom: 0px;
padding: 5px;
float: left;
position: relative;
top: 0px;
left: 5px;
width: 592px;
z-index:8;
}
.oversigt {
float: left;
position: relative;
padding-left: 4px;
width: 290px;
}
.kategorier1 {
float: left;
position: relative;
width: 275px;
}
.kategorier2 {
float: left;
position: relative;
width: 275px;
}
.faktaboks, .smalfaktaboks, .faktaboksright {
border: 2px solid rgb(74,74,74);
background: rgb(238,238,238);
color: rgb(0,0,0);
}
.faktaboks {
margin: 15px auto;
padding: 5px 3px 0px 3px;
position: relative;
width: 500px;
}
.smalfaktaboks {
padding: 5px 3px 0px 3px;
margin-bottom:10px;
position: relative;
width: 398px;
}
.faktaboksright {
padding: 3px;
float: right;
top: 10px;
left: 1px;
width: 170px;
margin-bottom: 3px;
}
p {
padding: 3px;
margin-top:0;
color: rgb(0,0,0);
}
li {
padding: 10px;
}
.sitemap {
margin-bottom: -1.3em;
}
.sitemap2 {
margin-bottom: 1.3em;
}
h1 {
font-weight: bold;
color: rgb(0,0,0);
background-color:inherit;
font-size: 300%;
margin-top: -0.1em;
}
h2 {
padding: 3px;
color: rgb(0,0,0);
background-color:inherit;
font-size: 120%;
font-weight: normal;
}
h3 {
color:rgb(0,0,0);
padding: 3px;
font-weight: bold;
font-size: 120%;
margin-bottom:0;
}
h4 {
padding: 3px;
color:rgb(0,0,0);
font-weight: bold;
margin-bottom:-0.5em;
}
h5 {
margin-top: -0.1em;
color:rgb(0,0,0);
font-size: 120%;
font-weight: normal;
}
.rubrik {
font-size: 170%;
margin-top:0;
}
.understreg {
text-decoration: underline;
}
.kursiv {
font-style: italic;
}
.fed {
font-weight: bold;
}
.midt span.fed {
font-weight: bold;
color:#222;
}
.red {
color:red !important;
}
td {
vertical-align: top;
}
form {
margin-bottom: -0.4em;
}
.flydestop {
clear: both;
}
a.tekstlink, a.tekstlinkher {
text-decoration: none;
}
a.sidelink {
color: rgb(0,0,0);
text-decoration: none;
}
a.venstremenulink {
background: rgb(255,255,204);
color: rgb(0,0,0);
text-decoration: none;
}
a.venstremenuoverskrift {
background: rgb(255,255,204);
color: rgb(0,0,0);
font-weight: bold;
text-decoration: underline;
}
a.menuoverskrift {
font-weight: bold;
text-decoration: underline;
}
a.venstremenulinkaktiv {
background: rgb(255,255,204);
color: rgb(119,119,119);
text-decoration: none;
}
a.venstremenulinkher:hover {
background: rgb(255,255,204);
color: rgb(0,0,0);
}
a.venstremenulink:hover {
background: rgb(193,224,247);
color: rgb(0,0,0);
}
a.sidelink:hover {
background: rgb(161,192,224);
color: rgb(51,51,51);
}
a.tekstlink:hover {
background: rgb(255,255,255);
color: rgb(68,68,68);
}
a.menulink {
color: rgb(255,255,255);
background: rgb(74,74,74);
text-decoration: none;
font-weight: bold;
}
a.menulinkaktiv {
color: rgb(187,187,187);
text-decoration: none;
font-weight: bold;
}
a.menulink:hover {
background: rgb(119,119,119);
color: rgb(255,255,255);
}
a.tekstlinkfed { background: rgb(255, 255, 255);
color: rgb(0, 0, 0);
text-decoration: none;
font-weight: bold;
}
a.sort {
color: rgb(0, 0, 0);
}
.midtlinks1, .midtlinks2, .midtlinks3 {
float: left;
margin-top: 8px;
margin-bottom: 8px;
padding-bottom: 8px;
width: 33%;
}
.midtlinks1, .right {
text-align: right;
}
.midtlinks2, .centrer, .billedemidt {
text-align: center;
}
#logo {
float: left;
width: 200px;
}
img, .reklamelink {
border: medium none ;
}
.billedeleft {
padding: 3px;
float: left;
margin-bottom: 5px;
}
.billedeoversigt {
padding: 3px 3px 1px;
float: left;
margin-bottom: -5px;
}
.billederight {
padding: 3px;
float: right;
margin-bottom: 5px;
}
.billedemidt {
padding: 3px;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom: 5px;
}
input {
border-style: solid;
border-color: rgb(0,0,0);
border-width: 0px 1px 1px 0px;
font-family: arial,sans-serif;
background-image: none;
font-size: 12px;
}
.bestilling input {
border-style: solid;
border-color: rgb(0,0,0);
border-width: 1px 1px 1px 1px;
font-family: verdana,arial,sans-serif;
background-image: none;
width:300px;
padding:3px;
}
.bestilling input.lilleform {
border-style: solid;
border-color: rgb(0,0,0);
border-width: 1px 1px 1px 1px;
font-family: verdana,arial,sans-serif;
background-image: none;
width:40px;
padding:3px;
}
.bestilling input.mellemform {
border-style: solid;
border-color: rgb(0,0,0);
border-width: 1px 1px 1px 1px;
font-family: verdana,arial,sans-serif;
background-image: none;
width:200px;
padding:3px;
}
textarea {
border-style: solid;
border-color: rgb(0,0,0);
border-width: 0px 1px 1px 0px;
background-image: none;
font-family: helvetica,arial,sans-serif;
font-size: 12px;
}
.bestilling textarea {
border-style: solid;
border-color: rgb(0,0,0);
border-width: 1px 1px 1px 1px;
font-family: verdana,arial,sans-serif;
background-image: none;
width:300px;
padding:3px;
}
.streg {
text-decoration: underline;
font-size: 150%;
font-weight:bold;
margin-bottom:2px;
}
ul {
margin-top:0px;
padding-top:0px;
}
.i {
font-family: times,serif;
}
.overskrift {
padding-top: 35px !important;
}
.kategorier1, .kategorier1, .oversigt, a.tekstlink span.fed {
color:rgb(0,0,0)
}
.footer {
position: relative;
padding:0px;
top:0px;
width: 768px;
background-image: url(../billeder/baggrund-footer.png);
background-repeat: no-repeat;
background-color: rgb(255,255,255);
}
.kant {
border:solid 1px black;
}
.annonceboks {
background-color:#fff;
border:solid 1px black;
width:140px;
margin-left:auto;
margin-right:auto;
padding:0;
font-family:arial;
margin-top:10px;
margin-bottom:10px;
text-align:center;
}
.annonce {
color:#fff;
background-color:#32669A;
text-align:center;
}
p.annonce {
margin:0px;
padding:0px;
}
dt {
margin-top:20px;
font-weight:bold;
}
table.tabelkanter {
border-collapse:collapse;
border:solid;
border-width:1px;
border-color:black;
}
table.tabelkanter td{
border:solid;
border-width:1px;
border-color:black;
padding-left:5px;
}
.indryk {
margin-left:20px;
} |
</MOLOKYLE>
</MOLOKYLE>
| |
| Kommentar
Fra : Eyvind |
Dato : 25-06-09 19:35 |
|
Nå Molokyle - er du ved at komme på mærkerne igen....................med kodningen.
| |
| Kommentar
Fra : EA_HS |
Dato : 25-06-09 22:31 |
|
Citat
Ps. Iøvrigt kan vi ik' rigtigt bruge dine link til 'noget' |
 .......... vil det sige at ingen kan se / læse disse link,.. :
http://kimludvigsen.dk/index.php
http://kimludvigsen.dk/programmer-internet-kompozer-trin-tips.php
..........................................
Eyvind
jeg lånte engang hæftet 'Kompozer'
men der står ikke mere i hæftet, end på Kim Ludvigsens hjemmeside,
som jeg henviser til,.......
www.kimludvigsen punktum dk
men det hjælper selvfølgelig ikke,.. hvis du / i ikke kan se / læse linket, ?
er der mon noget i vejen med indstillingerne på min PC,.. ?
| |
| Kommentar
Fra : EA_HS |
Dato : 25-06-09 22:46 |
| | |
| Kommentar
Fra : Eyvind |
Dato : 25-06-09 23:03 |
|
Jo jo - vi kan læse og kigge på dine link fra kim Ludvigsen - men Molokyle mener nok at selve kodningen (css) ikke kan ses men kun resultatet i det link.
Jeg kan i dine to link se afrundede boxe
| |
| Kommentar
Fra : EA_HS |
Dato : 25-06-09 23:42 |
|
afrundede boxe,...
de skulle ellers være 'kantede' (ikke runde hjørner som KANDU boxe,. ø/v og nederste/h)
Jeg har prøvet at ‘rode’ lidt med Kompozer,
og indsat en skabelon (1-2)
skabelonen er opbygget i nogle koder, eller stilark, (CSS-editor)
jeg vil gerne ha’ ’Boksen’ placeret ved markøren, (på første foto)
Jeg går ud fra ’Boksen) skal tilføjes ’stien’ indhold,.. ? (foto 2)
men hvordan gør jeg det i praksis,
der kan indsættes flere forskellige tabeller, og ’formularer’
fx formular felt
formular billede
tekstområde
valgliste
definer knap
definer etikette
definer feltsæt
( må meget gerne klippes ud i pap,.. masser af pap,)
http://peecee.dk/upload/view/177833
http://peecee.dk/upload/view/177834
sidste foto viser css-stilark,.. som de kaldes.
| |
| Kommentar
Fra : molokyle |
Dato : 26-06-09 09:37 |
|
 Jeg tror du skal læse lidt på lektien 
De 'bokse' du omtaler er såmen bare et resultat af den 'box-model', som ALLE (X-)HTML elementer er underlagt. En BOKS er intet andet end layout egenskaber for et element defineret i CSS.
En simpel box laves f.eks. ud fra et alm. <div> ..</div> afsnit ved at angive dette elements egenskaber:
Størrelse: højde og bredde.
Placering: koordinaer.
Baggrund: farve eller grafik.
Ramme: Tykkelse og afbildning (linje-type el. grafik.)
Margin: Afstand til nabo-element/-er.
Padding: Indre 'luft' til indhold.
http://www.w3schools.com/css/css_boxmodel.asp
En sådan boks kunne se således ud i CSS:
Kode
<style type="text/css">
<!--
div.boks {
position:absolute;
top:64px;
left:128px;
margin:0;
padding:4px;
height:128px;
width:250px;
border-color:red;
border-style:solid;
border-width:2px;
color:#fff;
background:#000;
}
-->
</style> |
..og (X-)HTML koden der benytter denne typografi f.eks.:
Kode
<div class="boks">
<p>
Dette er min boks.
</p>
</div> |
Resultatet ses her: http://www.cssboxing.com/temp/boks.html
</MOLOKYLE>
| |
| Kommentar
Fra : molokyle |
Dato : 26-06-09 11:39 |
| | |
| Kommentar
Fra : molokyle |
Dato : 28-06-09 15:16 |
|
Når du er blevet færdig med at læse, så kan du med din viden om box-modellen, f.eks. lynhurtigt lave en dynamisk menu med CSS, uden nogen form for javascript eller events, der både validerer korrekt i forhold til webstandarderne og som vises ens i alle de gængse moderne browsere.
Prøv det. Det er nemt ! 
Her en sådan simpel menu baseret på en div markør, nogle link markører indeholdende en inline span markør, lidt tekst og intet andet: http://www.cssboxing.com/temp/simpelmenu.html
Man kan selvfølgelig tilrette og lave alskens staffage, som link-/bagrundsgrafik således, at designet passer til sidernes øvrige indhold. Oftest vil man dog nok vælge, at basere sine menuer på en uordnet liste, da det så bli'r en smule mindre kompliceret at lave undermenuer mm.
Happy coding... 
</MOLOKYLE>
| |
| Kommentar
Fra : molokyle |
Dato : 29-06-09 19:11 |
|
...nogle få ændringer i CSS'en og man får en vandret menu ..UDEN, at ændre i selve XHTML koden:
http://www.cssboxing.com/temp/simpelhorizontalmenu.html
Egentlig er det derfor, at man bør lægge sin CSS kode i en ekstern fil.
Så skal man KUN rette i én fil for f.eks., at ændre udseende på en menu på ALLE sider.
Resten af koden forbliver den samme, som du vil kunne se ved, at sammenligne de 2 ovenstående eksempler.
Nemlig:
Kode
<body>
<div id="menu">
<a href="#1" accesskey="1" tabindex="1" title="link 1">Test 1<span class="info">Menuens 1. link.</span></a>
<a href="#2" accesskey="2" tabindex="2" title="link 2">Test 2<span class="info">Menuens 2. link.</span></a>
<a href="#3" accesskey="3" tabindex="3" title="link 3">Test 3<span class="info">Menuens 3. link.</span></a>
<a href="#4" accesskey="4" tabindex="4" title="link 4">Test 4<span class="info">Menuens 4. link.</span></a>
<a href="#5" accesskey="5" tabindex="5" title="link 5">Test 5<span class="info">Menuens 5. link.</span></a>
<a href="#6" accesskey="6" tabindex="6" title="link 6">Test 6<span class="info">Menuens 6. link.</span></a>
</div>
</body> |
</MOLOKYLE>
| |
| Kommentar
Fra : EA_HS |
Dato : 30-06-09 00:50 |
|
</MOLOKYLE>
Jeg er ikke I tvivl om at du har stor viden udi,.. it / hjemmesider mm.
Den eneste erfaring jeg har, er at jeg engang har ”konstrueret” en side i google pages,
123 hj.sider,.. lidt læsning omkring HTML o.lign…. det er jo til at overse,.. 
(nok omkring 2 min. ud af et døgn) 
det forekommer mig, at være uendeligt ’tungt’ og langsommeligt,
hvis jeg skulle lære det, blot nogenlunde,.. vil det formentlig tage så lang tid,
at der er kommet helt nye systemer til,.. og det jeg er begyndt på er forældet,
det er altså IKKE noget jeg skal / vil, bruge mere tid på end højest nødvendig,
derfor har jeg (indtil videre) valgt programmet Kompozer,.. (muligvis Dreamweaver)
fordi det er opbygget,.. næsten klar til brug,.. ved hjælp af ’færdige’ skabeloner’,
dét,. begrænser mit arb. mest muligt,..
der er dog forskellige ting jeg er i tvivl om,.. bl.a. den nævnte ’Boks’
(kunne dog undværes,.. i værste fald)
selvom jeg læste / studerede alle dine links (indgående) .. og mere til,
vil jeg sikkert stadig være i tvivl om mange ting,
(man kan jo heller ikke ”læse sig” til at køre bil, fx)
Men, men,
når jeg prøver at indsætte nogle af dine (første koder) fungerer det ikke i Kompozer, 
måske du kan forklare mig hvorfor,.. ?
hvis jeg derimod indsætter din,.. SIDSTE kode i ’min Kompozer skabelon’,
http://peecee.dk/upload/view/177833
kommer det til at sådan ud, :
http://peecee.dk/upload/view/178491
altså,.. faktisk ok,.. 
det skulle bare være en boks,.. 'lodret aflang ramme',.. der kan indsættes tekst, fotos, link mm.
nogenlunde som denne,.. (reklame for Kompozer hæftet) :
http://kimludvigsen.dk/programmer-internet-kompozer-trin-tips.php
hvordan gør jeg det,.. eller hvordan skal koden se ud,.. ?
jeg kan jo se at det er ved at ligne noget rigtig nu,…. 
| |
 | Du har følgende muligheder | |
|
Dette spørgsmål er blevet annulleret, det er derfor ikke muligt for at tilføje flere kommentarer.
| |
|
|