Alle Artikel mit dem Schlagwort: CSS

Android Apps programmieren – schnell und einfach mit HTML, CSS und JavaScript

Das Programmieren von Android Apps kann einfach sein – wenn man die richtigen Entwicklungswerkzeuge zur Verfügung hat. Mit Hilfe von HTML, CSS und JavaScript ist es zum Beispiel möglich, dass Websites auch auf einem Android-Webbrowser eine gute Figur machen oder Anwendungen zu programmieren, die auch offline funktionieren. Im folgenden Textausschnitt aus dem Buch „Android Apps mit HTML, CSS und JavaScript“ beschreibt der Autor Jonathan Stark, welche Vorteile der Einsatz dieser Werkzeuge mit sich bringen kann. Googles Android-Betriebssystem ist eine faszinierende Ergänzung im Raum mobiler Informationsverarbeitung. Im wahren Google-Geiste ist die Plattform offen, frei und höchst interoperabel. Die Entwicklungswerkzeuge sind ausgereift und mächtig, wenn auch etwas geekhaft, und sie laufen auf einer Vielzahl von Plattformen. Telekommunikationsunternehmen und Gerätehersteller sind auf den Android-Zug aufgesprungen. Immer mehr Android-Geräte der unterschiedlichsten Formen und Größen strömen auf den Markt. Für Entwickler ist das eine zweischneidige Angelegenheit. Einerseits bedeuten mehr Geräte auch einen größeren Markt. Andererseits bedeuten mehr Geräte auch mehr Fragmentierung. Der Fragmentierung im Android-Markt können Sie ebenso wie der Fragmentierung im allgemeinen Markt mobiler Technologien dadurch begegnen, dass Sie …

Best Practices für HTML&CSS

Ohne HTML geht im Web gar nichts. Jede Website besteht aus <html>, <head> und <body>, und der Browser jedes Webusers liest diese Tags, um uns die Website anzuzeigen. Doch die Auszeichnungssprache ist voller Altlasten, die aktuelle Version 4.01 gibt es schließlich bereits seit 1999, wurde lediglich durch XHTML ergänzt. Bereits seit einigen Jahren entwickelt das W3C daher an HTML5, das den Ansprüchen moderner Websites besser gewachsen sein soll. Mit Grauen erinnere ich mich beispielsweise an Zeiten, in denen man mindestens drei Audio- und Videoplayer installiert haben musste, um halbwegs unterbrechungsfrei zu surfen. (Kennen Sie noch den Realplayer?? Mir schwirrt noch immer das Wort „deinstall“ im Kopf herum, sobald ich auch nur eine Datei sehe, die mit real* beginnt…) Die Verbreitung von Flash hat das Surfen mittlerweile leichter gemacht – aber das neue HTML5 will noch mehr: Sämtliche Plugins sollen überflüssig werden, der Webprogrammierer erhält dafür neue Tags wie etwa <video> für das Einbinden von Videos oder <canvas>, das für Spielanwendungen genutzt werden kann. Ganz so, wie man es seit Jahren für Bilder und Tabellen kennt. …

„Web-Apps“ im Vergleich zu „nativen Apps“

In unserem Buch „iPhone Apps mit HTML, CSS und JavaScript entwickeln“  definiert der Autor Jonathan Stark, was mit einer „Web-App“ im Vergleich zu einer „nativen App“ gemeint ist. Er beschreibt jeweils die wesentlichen Vor-und Nachteile der Ansätze und wie man es mit den drei Standardwebtechnologien schafft, das Beste aus beiden Welten herauszuholen. Was ist eine Web-App? Für mich ist eine Web-App im Wesentlichen eine Website, die speziell für das iPhone optimiert wurde. Diese Website kann alles sein, von einer Standardbroschüre eines kleinen Unternehmens über einen Zinsrechner bis hin zu einem täglichen Kalorienzähler – der Inhalt spielt keine Rolle. Die entscheidenden Merkmale einer Web-App sind, dass die Benutzeroberfläche mit Standard-Webtechnologien erstellt wurde, dass sie über eine URL ansprechbar ist (öffentlich, privat oder versteckt hinter einem Log-in) und dass sie speziell auf die Besonderheiten des iPhone optimiert wurde. Eine Web-App wird weder auf dem iPhone installiert, noch ist sie im App Store verfügbar, und sie ist auch nicht in Objective-C geschrieben. Was ist eine native App? Im Gegensatz dazu werden native Anwendungen auf dem iPhone installiert, haben …

CSS-Sprechstunde für Power-User – Attribute: Der Selektor der Zukunft

Wenn es um die Gestaltung von Formularen geht, hauen einen Typ-Selektoren nicht unbedingt vom Hocker. Schließlich wird für Textfelder, Radiobuttons, Checkboxen, Passwortfelder und Buttons das gleiche HTML-Tag benutzt: <input>. Eine Breitenangabe von 200 Pixeln mag für ein Textfeld sinnvoll sein, Ihre Checkboxen sollen aber vermutlich nicht ganz so groß ausfallen. Das heißt, Sie können nicht einfach schreiben: input { width: 200px; }. Momentan besteht die verlässlichste Methode darin, Textfelder mit einer eigenen Klasse zu markieren, z.B.  <input type=“text“ class=“textfeld“ name=“email“ />. Über den entsprechenden Klassen-Selektor können dann eigene Stilregeln definiert werden. Vermutlich schon bald können Sie allerdings den Attribut-Selektor für diese Aufgabe verwenden, der wesentlich mehr Möglichkeiten bietet. Ein Attribut-Selektor wählt ein HTML-Element anhand seines Attributs aus. Bei <input>-Tags bestimmt der Wert des Attributs type, welche Art von Formularelement tatsächlich erzeugt wird. Für ein Textfeld ist dies beispielsweise der Wert text. Um den Hintergrund für alle einzeiligen Textfelder blau einzufärben, könnten Sie die folgende Regel verwenden: input[type=“text“] { background-color: blue; } Wenn Sie den Attributwert im obigen Beispiel von text in submit ändern, wird stattdessen …

Häufig gestellte Fragen zu CSS: Hierarchische Untermenüs

Wie erstelle ich diese coolen Untermenüs, die erscheinen, wenn ich mit der Maus über einen Button fahre? Navigationsleisten mit mehreren Menüebenen, die bei Bedarf herausfahren oder aufklappen, sind äußerst beliebt. Sie bieten eine ideale Möglichkeit, eine Menge Links in eine kompakte Navigationsleiste zu packen. Hierfür gibt es mehrere Herangehensweisen. Zuerst die reine CSS-Lösung. Ein sehr beliebtes Vorgehen für hierarchische Aufklappmenüs heißt »Son of Suckerfish«. (Die Vorgängerversion hieß einfach »Suckerfish«.) Die Details finden Sie unter der Adresse http://www.htmldog.com/articles/suckerfish/. Eine gute (englische) Anleitung für die Erstellung horizontaler Aufklappmenüs mit mehreren Ebenen finden Sie unter der Adresse www.tanfa.co.uk/css/examples/menu/tutorial-h.asp. Auf der gleichen Website befindet sich auch eine Anleitung für die Erstellung vertikaler Menüs mit aufklappbaren Untermenüs: www.tanfa.co.uk/css/examples/menu/tutorial-v.asp. Ein Nachteil der reinen CSS-Lösungen besteht darin, dass die Untermenüs sofort wieder verschwinden, sobald sich der Mauszeiger des Benutzers nicht mehr darüber befindet. Sie können entweder darauf vertrauen, dass alle Ihre Benutzer hervorragende Reflexe haben, oder Sie verwenden einen anderen Ansatz: Benutzen Sie CSS, um die Buttons zu gestalten, und JavaScript, um die Funktionen der Untermenüs zu steuern. Sie finden verschiedene JavaScript-gesteuerte …