CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
Avatar billede caloni Nybegynder
25. juli 2012 - 23:12 Der er 38 kommentarer

'Til top' ud for overskrift

Hvordan laver man en 'Top' ud for en overskrift? Mit problem er at overskriftskoden laver et linjeskift. Og så ender den neden under.

Vil også gerne vide om man kan tvinge en anden skriftstørelse igennem, hvis f.ek.s en <small></small> ikke virker. Det er åbenbart bestemt i css'en. Kan ikke css.
Avatar billede olebole Juniormester
25. juli 2012 - 23:52 #1
<ole>

"Kan ikke css" >> Så må du se at komme i gang med det. CSS er en helt nødvendig forudsætning for at kunne skrive websider  =)

Løsningen kommer an på din allerede bestående kode - både HTML- og CSS-koden

/mvh
</bole>
Avatar billede scootergrisen Nybegynder
26. juli 2012 - 00:03 #2
Du laver et element med en id attribut øverst på din side :
<a id="toppen"></a>

Også kan du linke til den med :
<a href="#toppen">Gå til toppen</a>

Og ja hvis du skal ændre skiftstørrelse så gør det med CSS.
Så det bliver du nok nød til at at lære men det er heldigvis ikke så svært igen.

Du kan for eksempel skrive :
<h1 style="font-size:20px;">Min overskrift</h1>

CSS koden er det som står ved style.

Det vil dog være bedst at have din CSS kode i sin egen fil.

Du kan lærer om CSS her : http://w3schools.com/css/css_howto.asp
Avatar billede olebole Juniormester
26. juli 2012 - 01:26 #3
Når du så har lært en masse forkert, kan du lære rigtig CSS på f.eks. SitePoint  =)

w3schools.com er herostratisk berømt for at være fyldt med mangler, misforståelser og seriøse fejl
Avatar billede caloni Nybegynder
26. juli 2012 - 01:38 #4
Argh, det fik ikke meget ud af at spørge om. I hvert fald ikke en løsning.

<i>
Du laver et element med en id attribut øverst på din side :
<a id="toppen"></a>

Også kan du linke til den med :
<a href="#toppen">Gå til toppen</a>
</i>

Jeg har i forvejen <a href="#top">TOP</a> i bunden af siden. Det virker. Så ser ud til man ikke behøver begge koder.
Avatar billede caloni Nybegynder
26. juli 2012 - 01:43 #5
Jeg spørger i øvrigt ikke om bund til top. Skal have en 'top' ved siden af nogler overskrifter ned ad siden.
Avatar billede caloni Nybegynder
26. juli 2012 - 01:53 #6
Det glemte jeg at skrive.
Avatar billede caloni Nybegynder
26. juli 2012 - 01:57 #7
Hvis jeg vil sætte en Top ind flere steder på siden og have de skal føre til toppen, er jeg med på jeg skal have <a id=""></a> øverst.
Men den laver også en afstand. Hvordan undgår jeg det?
Avatar billede caloni Nybegynder
26. juli 2012 - 01:59 #8
Det var vist forkert kode. lige meget. Hvordan undgår jeg afstand? Det kan i vel godt fortælle mig?
Avatar billede scootergrisen Nybegynder
26. juli 2012 - 05:05 #9
Du laver bare et link alle de steder du vil.
Alstå ved hver overskrift indsætter du <a href="#toppen">Gå til toppen</a>

Og i stedet for at have <a id="toppen"></a> så kan du gøre det på body tagget <body id="toppen"> så laver den ikke mellemrum.

Gruden til det virker selvom du ikke har nogen id med det navn er at den viser toppen af siden når den ikke kan finde det id.
Avatar billede caloni Nybegynder
26. juli 2012 - 17:19 #10
Du laver bare et link alle de steder du vil.
Alstå ved hver overskrift indsætter du <a href="#toppen">Gå til toppen</a>

Sætter den ind ud for en overskrift (f.eks. <h3>) ender den neden under i stedet for ud for, fordi overskriftkoden laver et linjeskift. Jeg vil gerne havde den ved siden af overskriften.
Avatar billede scootergrisen Nybegynder
26. juli 2012 - 20:57 #11
Kom med et link til siden så vi kan se det.
Avatar billede olebole Juniormester
26. juli 2012 - 21:25 #12
Du har uden tvivl sat nogle uhensigtsmæssige styles. Denne kode fungerer således helt som forventet:

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>

<p>Blabla bla bla blabla</p>
<h3 id="myHeader">Overskrift</h3>

<div style="width:50px;height:2000px;background:yellow">Høj</div>

<p>Blabla bla bla blabla</p>
<p><a href="#myHeader">Til overskriften</a></p>

</body>
</html>
Avatar billede caloni Nybegynder
26. juli 2012 - 22:37 #13
Jeg har ikke sat ret meget. Det er en Drupal side. Så jeg har kun skrevet teksten.
Avatar billede caloni Nybegynder
26. juli 2012 - 22:39 #14
Men forstår ikke hvad du mener.

Dit eget eksempel: <h3 id="myHeader">Overskrift</h3> X

det er så hvor jeg har sat et X at jeg gerne vil placere "Top". Men h3 laver jo et linjeskift. Selv i dit eksempel!??
Avatar billede scootergrisen Nybegynder
26. juli 2012 - 22:47 #15
Hvordan skal vi kunne hjælpe dig hvis du ikke kan komme med et link til siden ?

Skal vi bare gætte os til hvordan din kode er ?
Avatar billede caloni Nybegynder
26. juli 2012 - 22:57 #16
Jeg troede der fandtes en almindelig kendt måde at gøre det på jeg beder om. Gør der ikke det? ER det nødvendig at se hele koden for at fortælle at fortælle hvordan man undgår et linjeskift ved efter h3?

Jeg prøver ikke at være på tværs.
Avatar billede caloni Nybegynder
26. juli 2012 - 23:01 #17
Der er ikke meget at se.

<h4 id="kat3"><span style="text-decoration: underline;"><strong>Kategori 3</strong></span></h4>

På hver side af det (oven over og neden under) er der bare almindelig tekst.

For enden af </h4> vil jeg have 'Top'.

Hvad er det mere i skal se??
Avatar billede olebole Juniormester
27. juli 2012 - 00:20 #18
Jeg prøver lige igen:

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>

<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<h4 id="kat3"><span style="text-decoration: underline;"><strong>Kategori 3</strong></span></h4>

<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>
<p>Blabla bla bla blabla</p>

<p>Blabla bla bla blabla</p>
<p><a href="#kat3">Til kategori 3</a></p>

</body>
</html>
Avatar billede caloni Nybegynder
27. juli 2012 - 00:39 #19
Ja så hopper den fra bunden til det sted i teksten du har placeret den øvertse kode. Men det er stadig ikke det jeg spørger om. Den skal hoppe fra et sted i teksten (ved hver overskrift) og til toppen.

Og jeg kan ikke placere en <a href="#top">Top</a> ved hver overskrift, da h3 flytter den ned under overskriften.

I øvrigt fungere de to koder åbenbart kun hvis der er en id kode i <h4> og der er en i dem alle i forvejen, da jeg også linker fra en indholdsfortegnelse øverst på siden og ned til hver overskrift.

Men det ser ud til I ikke forstår hvad det er jeg ikke forstår. Og jeg forstår ikke hvad det er i ikke forstå forstår. På den måde virker det ret håbløst. Måske vi bare skal opgive det?
Avatar billede caloni Nybegynder
27. juli 2012 - 00:40 #20
... hvis der kun er en id kode i <h4>  ...
Avatar billede olebole Juniormester
27. juli 2012 - 00:44 #21
Din kode er nok lettere at forstå. Prøv at poste den
Avatar billede caloni Nybegynder
27. juli 2012 - 01:12 #22
Jamen jeg har ikke noget kode. Kun det der ligger i editoren.

Og det er - ud over almindelig tekst uden nogen koder overhovedet - *kun* <h4 id="tekst"><span style="text-decoration: underline;"><strong>tekst</strong></span></h4> ned ad siden.

Det er alt!
Avatar billede scootergrisen Nybegynder
27. juli 2012 - 02:39 #23
<div>
  <h4 id="kat3" style="display:inline;"><span style="text-decoration: underline;"><strong>Kategori 3</strong></span></h4>
  <a href="#toppen">Gå til toppen</a>
</div>
Avatar billede olebole Juniormester
27. juli 2012 - 03:13 #24
Ahhh ... så forstår jeg  =)

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body {
    margin: 0;
    padding: 0;
    font: 12px verdana, sans-serif;
}
h4 {
    position: relative;
}
h4 span {
    margin-right: 40px;
    text-decoration: underline;
    vertical-align: middle;
}
h4 a {
    font-size: 10px;
    font-weight: normal;
    vertical-align: middle;
    text-decoration: none;
    color: #000;
}
h4 a:hover {
    text-decoration: underline;
    color: #c00;
}
</style>
</head>
<body>

  <h4 id="kat3"><span>Kategori 3</span><a href="#toppen">Gå til toppen <b>^</b></a></h4>

</body>
</html>
Avatar billede olebole Juniormester
27. juli 2012 - 03:14 #25
- og visk bare denne ud:


h4 {
    position: relative;
}
Avatar billede caloni Nybegynder
27. juli 2012 - 04:12 #26
[small] tekst [/small]
Avatar billede caloni Nybegynder
27. juli 2012 - 04:15 #27
#23 kan jeg ikke få til at fungere. Det er stadig det samme. 'Gå til Toppen' rykker ned.
Hvis det burde fungere, er grunden til det ikke gør måske at der er noget i css'en som overtrumfer?

#24 ved jeg ikke helt hvad jeg skal stille op med. Dvs. jeg ved godt hvor meget af det jeg skal sætte ind. Men ikke hvor i dokumentet. Men det er måske lige meget, bare der er system i det?

En pinlig tilføjelse. Har opdaget at h4 slet ingen effekt har. Skriftstørelsen forbliver den samme om jeg vælger h4 eller f.eks. h1. Overskrifterne er bare den almindelig skrift i fed. Ved ikke hvad jeg har haft gang i.
Så der er noget i css'en som forhindre mig i selv at bestemme hvornår skriften skal have en bestemt størrelse. Det er nu lige meget. Jeg er tilfreds med den størrelse de har.

Men jeg kan ikke fjerne h4 koderne, for så ved jeg ikke hvad jeg skal sætte id=""  ind i.

Har vist ikke helt styr på det. :D
Avatar billede olebole Juniormester
27. juli 2012 - 14:41 #28
Tør man mon håbe på, du efter 27 indlæg endelig er ved at forstå vigtigheden af at vise den kode, vi diskuterer?
Avatar billede caloni Nybegynder
27. juli 2012 - 17:08 #29
Hvilken kode. Det i editoren? css'en? Eller alt?
Avatar billede olebole Juniormester
27. juli 2012 - 17:45 #30
HTML og CSS
Avatar billede caloni Nybegynder
12. august 2012 - 19:54 #31
Jeg vil helst ikke linke til den pågældende siden. Derfor bliver vi nok nød til at lade det være. Men jeg giver gerne point ud for 'brugt tid'!
Avatar billede olebole Juniormester
12. august 2012 - 20:00 #32
Jamen, hvis du flover dig så meget over koden, må vi vel stoppe her. Hvad point angår, så samler jeg ikke. Prøv at spørge nogle af de andre, hvis tid du har spildt
Avatar billede caloni Nybegynder
13. august 2012 - 00:13 #33
Den bemærkning giver mig ikke dårlig samvittighed. Det er jer selv der har balgt at hænge på så længe som der nu er tale om.
Avatar billede caloni Nybegynder
13. august 2012 - 00:14 #34
Vil i begge have point, får i 15 hver.
Er der kun en der vil have point, beholder jeg de 15.
Avatar billede olebole Juniormester
13. august 2012 - 00:23 #35
Det glæder mig, for det har aldrig været meningen at give dig dårlig samvittighed - blot at få dig til at tænke  =)
Avatar billede caloni Nybegynder
13. august 2012 - 20:09 #36
LOL ... Jeg skal snart ud at rejse. I den forbindelse kommer jeg ned gennem "hele" Tyskland. Skal prøve om jeg undervejs kan  huske at købe en ny hjerne. Mon ikke de, som så meget andet, fås billigere der ...

Vil det kunne gøre dig glad?
Avatar billede olebole Juniormester
13. august 2012 - 22:38 #37
Ja, havenisserne siges at stamme fra Tyskland - så mon ikke der skulle være et overkommeligt reservedelslager? Selvom jeg absolut anerkender din fremskridtsvenlige plan, ændrer den ikke på mit humør. Det er i forvejen fortrinligt  =)

God tur og held og lykke med planen. Respekt!  :D
Avatar billede caloni Nybegynder
16. august 2012 - 18:42 #38
.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Bredde på div elementer Af dane022 i HTML 2 16/02/202408:29 20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML 2 21/12/202322:51 22/12/202308:03
validering <input tlfnr. Af slein55 i HTML 5 15/10/202311:43 15/10/202314:51
Link fra form input Af jnrmgs i HTML 9 19/09/202319:10 23/09/202313:11
includere i HTML Af slein55 i HTML 3 15/09/202313:47 16/09/202309:40
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester



Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 16:05 win 10 vil ikke boote Af bb69 i Windows
I dag 11:20 Lenovo x390 Af tobberjas i PC
I dag 10:14 Alder i Excel Af Nanarsi i Excel
I dag 09:00 Flere linier på faneblad Af Peder Lund Nielsen i Excel
I går 21:35 Flash Player Af ErikHg i Andet software
White papers
Flere white papers »


Premium
Teaser billede
Rigsrevisionen kritiserer fire statslige myndigheder for dårlig it-sikkerhed: Har haft seks år til at løse problemet
Læs mere »
Microsofts nye Windows 11-funktion kaldes ”en guldgrube for hackere”
"Jeg var den sjette medarbejder, der blev ansat dengang, i dag er vi over 1000"
Twoday rykker hovedkontoret til Nordhavn: Opsiger flere lejemål og samler kontorer
Se alle »
Computerworld
Teaser billede
MobilePay ændrer på funktion få måneder efter stor opdatering
Læs mere »
Den næste version af Windows 11 er nu tilgængelig for de første brugere: Se, hvad du kan forvente
Kæmpemæssig AI-opdatering styrer mod din iPhone: Derfor bliver iOS 18 særlig interessant
Test af Apples magtdemonstration: Den nye iPad Pro er klodens bedste tablet – men måske det ikke er nok alligevel?
Se alle »
CIO
Teaser billede
Energinet får igen kritik for milliardstor outsourcing: To væsentlige it-sikkerhedstiltag er ikke blevet indført til tiden
Læs mere »
Nomineret til Årets CIO: Martin Wood har skabt en leveringsmaskine hos Domstolsstyrelsen - Håber det kan inspirere andre offentlige myndigheder
Han er en af Danmarks bedste CIO’er: Topdanmarks Kasper Tjørntved Davidsen står i spidsen for digitale transformationer til milliarder af kroner
Bestyrelser på pinebænken under hackerangreb: "Altså 500.000 euro i løsesum er jo ikke så meget"
Se alle »
Job & Karriere
Teaser billede
Her er Danmarks fem bedste CIO’er lige nu: Se de fem nominerede til prisen som Årets CIO 2024
Læs mere »
Medarbejderne fik udleveret badetøfler ved indflytningen: Kom med inden for i IBM Danmarks nye topmoderne hovedkontor
Google fyrer hele sit Python-team
Får du den løn, du fortjener? Få overblikket over hvor meget dine kolleger tjener hver måned
Se alle »
White paper
Teaser billede
MDR: Transparent sikkerhed og overvågning i realtid
Læs mere »
Nemmere overblik, styring og omkostningskontrol i dit multicloud-miljø
Optimering af Source-to-Pay: Identificér oplagte gevinster og skær omkostninger
Sådan høster du forretningsfordelene ved Internet of Things
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »