zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS "3DButton" auslagern...

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 27.10.2011, 15:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2011
Beiträge: 3
AxelBB befindet sich auf einem aufstrebenden Ast
Standard CSS "3DButton" auslagern...

Hallo liebe Helfer,
als kurze Info: Ich bin blutiger Anfänger und verstehe nocht nicht wirklich!
Mein Problem in Worten: Ich möchte eine funktionierende Internetpräsenz ( Onlineshop ) bis Mitte, Ende nächsten Jahres auf die Beine stellen, es geht mir weniger um das Betreiben als um den Lerneffekt den ich mir davon erhoffe.
Ich habe also Angefangen MEIN TEMPLATE zu schreiben.
In meiner template.css habe ich einen "3DButton" geschrieben:

a.dreidbutton{
color: #FFF; /* Hintergrundfarbe */
display: block; /* damit kompletter Bereich anklickbar, für IE */
width: 70px; /* leider muss für den IE eine Breitenangabe gemacht werden */
background: #9C0; /* Grundfarbe des Buttons */
padding: 10px 15px; /* Dem Text etwas Raum geben */
text-align: center; /* Text zentrieren */
font-family: Tahoma; /* Schriftart */
font-size: 0.7em; /* Schriftgröße */
text-decoration: none; /* Linkunterstreichung entfernen */
font-weight: bold; /* Text fett machen */
}

a.dreidbutton{
color: #FFF;
display: block;
width: 70px;
background: #9C0 url(button_bg.gif) top repeat-x;
padding: 10px 15px;
text-align: center;
border-top: #DBFF6C 2px solid; /* Farbe und Art des oberen Rands */
border-left: #DBFF6C 2px solid; /* linker Rand */
border-bottom: #698C00 2px solid; /* unterer Rand */
border-right: #698C00 2px solid; /* rechter Rand */
font-family: Tahoma;
font-size: 0.7em;
text-decoration: none;
font-weight: bold;
}

a.dreidbutton:hover{
/* hier werden die Farben der entsprechenden Ränder genau umgekehrt, damit beim Überfahren mit der Maus ein eingedrückter Effekt entsteht. */
border-bottom: #DBFF6C 2px solid;
border-right: #DBFF6C 2px solid;
border-top: #698C00 2px solid;
border-left: #698C00 2px solid;
/* Um den Effekt des Eindrückens zu verstärken wird auch der Text durch verändern des Innenabstands um 1 Pixel verrückt */
padding: 11px 14px 9px 16px;
}

Nun möchte ich gerne wissen, wie ich die nötigen Dateien mit den Sätzen fütter?
Ich habe jetzt also noch meine index.php:

<?php
// No direct access.
defined('_JEXEC') or die;

JHTML::_('behavior.framework', true);
$app = JFactory::getApplication();
?>

<?php echo '<!DOCTYPE html>'; ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/template.css" type="text/css" />

</head>
<body>

<div id="wrapper">

<div id="header">

</div><!--header-->
<div class="dreidbutton">
<p>
<div id="content">
<div id="news"><jdoc:include type="modules" name="left" style="xhtml"/></div><!--news>
<div id="component"><jdoc:include type="modules" name="component" style="xhtml"/></div><!--component-->
<div id="menu"></div><jdoc:include type="modules" name="left" style="xhtml"/><!--menu-->
</div><!--content-->
</p>
</div>

<div id="footer"><jdoc:include type="modules" name="footer" style="xhtml"/></div><!--footer-->

</div><!--wrapper-->


</body>
</html>

und meine templatesDetails.xml:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE install PUBLIC "-//Joomla! 1.6//DTD template 1.0//EN" "http://www.joomla.org/xml/dtd/1.6/template-install.dtd">
<extension version="1.6" type="template" client="site">
<name>Schuhdreams</name>
<creationDate>27 April 2011</creationDate>
<author>Axel Baxmann</author>
<authorEmail>axel.baxmann@web.de</authorEmail>
<authorUrl>www.schuhdreams.de</authorUrl>
<copyright>Copyright (C) Schuhdreams</copyright>
<license>None</license>
<version>1.0.0</version>
<description>Das offizielle Design der Site Schuhdreams.de</description>
<positions>
<position>left</position>
<position>right</position>
<position>footer</position>
</positions>
</extension>

Ich möchte die Buttons für mein Menü verwenden. Oder kann ich das nicht weil ich ein Joomla Modul nutze??? ------>
<jdoc:include type="modules" name="left" style="xhtml"/></div>

Freue mich um Hilfe jeder Art auch wenn ich Antworten bekomme wie: Son Scheiß das macht doch alles keinen Sinn!!!
Dann aber bitte auch begründen, und das ausführlich!
Danke an alle die sich die Mühe machen!
AxelBB
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 27.10.2011, 15:19
$("#mettbröttchen");
XHTMLforum-Mitglied
 
Registriert seit: 28.09.2010
Ort: Bremen
Beiträge: 448
zeji wird schon bald berühmt werden
Standard

1. Code-Tags im Editor benutzen, das ist so sehr schwer lesbar.
2. Befass dich besser erstmal mit den Grundlagen, was Html/Css angeht, bevor du dich an Joomla, bzw Templating in Joomla ranwagst.


Davon mal abgesehen:
Warum definierst du in css das gleiche Element zweimal mit unterschiedlichen Eigenschaften?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 27.10.2011, 15:35
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2011
Beiträge: 3
AxelBB befindet sich auf einem aufstrebenden Ast
Standard

Mein Fehler! Sorry!
Ich habe diverse Bücher, in denen Joomla 1.6 umfangreich erklärt wird.
Mit Joomla habe ich weniger das Problem, ich würde gerne die Zusammenhänge und das Geflecht der Dateien verstehen! Ein Template besteht aus dutzenden Dateien die miteinander verknüpft sind.
Irgendwo muss ich anfangen, und meine Wahl war es jetzt ein Template zu erstellen, ein Buch darüber habe ich auch, nur leider muss man ziemlich genau an diesem Beispiel arbeiten und es lässt wenig Freiraum für eigene Ideen oder Umsetzungsmöglichkeiten!
Deswegen würde ich gerne wissen wie man a.dreidbutton anbindet, bzw einbindet!
An welche Stelle und wie es in etwa ausschaut weiß ich aber wie es genau Aussehen muss damit es klappt weiß ich nicht, geschweige denn warum es denn dann so aussehen muss!
Danke trotzdem schonmal.
Mit Zitat antworten
  #4 (permalink)  
Alt 27.10.2011, 16:27
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von AxelBB Beitrag anzeigen
An welche Stelle und wie es in etwa ausschaut weiß ich aber wie es genau Aussehen muss damit es klappt weiß ich nicht, geschweige denn warum es denn dann so aussehen muss!
Danke trotzdem schonmal.
wie schon erwähnt ohne XHTML/CSS-Grundlagen wird das leider nix.

Little Boxes ist deshalb dein Freund.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #5 (permalink)  
Alt 27.10.2011, 17:49
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von AxelBB Beitrag anzeigen
Ich habe diverse Bücher, in denen Joomla 1.6 umfangreich erklärt wird.
Mit Joomla habe ich weniger das Problem, ich würde gerne die Zusammenhänge und das Geflecht der Dateien verstehen! Ein Template besteht aus dutzenden Dateien die miteinander verknüpft sind.
Ja, bestimmt gibt es da Dutzende. Mit CSS -- dem Thema dieses Forenbereiches -- hat das aber nichts zu tun. Das ist Joomla-spezifisch.
Zitat:
Irgendwo muss ich anfangen, und meine Wahl war es jetzt ein Template zu erstellen,
Keine gute Idee. Dein Thread lässt eigentlich nur einen Schluss zu: Dass dir zunächst einmal die Zusammenhänge zw. HTML und CSS nicht klar sind. Das kannst du aber nicht in einem Wirrwarr aus "proprietären" Daten einer bestimmten Software lernen.
Deshalb auch von mir der Rat: Lass Joomla beiseite. Erarbeite dir zunächst ganz "händisch" die Grundlagen von HTML und CSS.
Erst wenn du darin sicher bist hat es Sinn, sich an ein System zu wagen. Denn erst dann wirst du die für dein System verfügbaren Anleitungen zum Templating auch verstehen können.
Mit Zitat antworten
  #6 (permalink)  
Alt 28.10.2011, 09:32
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2011
Beiträge: 3
AxelBB befindet sich auf einem aufstrebenden Ast
Standard

Dann werde ich wohl genau das erst einmal machen! Danke @ all!
Mit Zitat antworten
Antwort

Stichwörter
css-menü, php-menue

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
2 CSS Files -> 1 CSS File Habi CSS 7 17.02.2010 16:25
Verschachteln und Erweitern von CSS? DerJo CSS 4 25.01.2010 19:07
IE 6 erkennt seine CSS Datei nicht Perelina (X)HTML 4 07.08.2009 19:56
Eric Meyer's CSS Petty Ressourcen 0 21.11.2005 09:18
Mozilla ignoriert externes css DarkWanderer CSS 9 22.09.2005 12:39


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:26 Uhr.