Video: Free Dreamweaver CC 2018 Course - Introduction to Responsive Web Design 2024
Genom Janine Warner
Om du är ny för webbdesign eller har skapat HTML-sidor i flera år, är Adobe Dreamweaver CS6 det perfekta verktyget för att bygga din webbplats. I version CS6 hittar du en ny välkomstskärm och stöd för det senaste i Cascading Style Sheets (CSS3) och HTML5. Dreamweaver är ett populärt program bland professionella webbdesigners, liksom människor som vill bygga webbplatser för sina hobbyer, klubbar, familjer och småföretag.
Välkomstskärmen för Adobe Dreamweaver CS6
Dreamweavers lättanvända grafiska gränssnitt och en kraftfull lista över funktioner gör det till ett populärt val bland professionella webbdesigners och hobbyister. Med varje ny version erbjuder Dreamweaver CS6 nya funktioner, men du hittar fortfarande den välbekanta välkomstskärmen som hjälper dig att komma igång.
Dreamweaver CS6: Lägga till textskuggor med CSS3
I Dreamweaver CS6 kan du förbättra dina mönster och ge dina sidor större djup genom att lägga till textskuggor med CSS3-regler, det senaste inom webbteknik. Lägga till textskuggor gör dina ord enklare att läsa, speciellt om din design har en komplex bakgrund eller om dina bakgrunds- och textfärger saknar kontrast.
Dreamweaver CS6 innehåller stöd för CSS3-textskuggor när du använder panelen Egenskaper i panelen CSS Styles. Du kan skapa klass- eller ID-stilar med textskuggor och du kan lägga till textskuggor i befintliga HTML-element genom att definiera en taggstil, till exempel rubriken 1-stil som används i bilden.
CSS3-koden som skapar den textskuggan är
h1 {text-skugga: 2px 2px 3px # 000;}
Numren i koden anger att textskuggan ska sträcka 2 pixlar åt höger och 2 Pixlar under texten med en 3-pixel oskärpa. Dessutom skapas skuggan med färg svart, specificerad av den förkortade hexadecimal färgkoden # 000.
När du skapar regler för textskuggor kan du ange upp till fyra värden:
-
Horisontell och vertikal: De två första värdena krävs och specificera de horisontella och vertikala förskjutningarna - det avstånd som fallskuggan sträcker sig under text (horisontal) och till höger om texten (vertikal).
-
Blurradie: Det tredje värdet anger mängden oskärpa i skuggan. Om du inte inkluderar oskärpa radie är standard 0, vilket gör att skuggan visas som en helfärgad färg.
-
Färg: Det fjärde värdet anger skuggans färg och kan definieras med en hexadecimal färgkod eller en RGBa-färgkod.
Du kan lägga till en textskugga med egenskapsfönstret längst ner på panelen CSS Styles, som visas i bilden.Gör så här:
-
Klicka på länken Lägg till egenskap i den vänstra delen av egenskapsfönstret CSS-format.
-
Ange regeringsnamnet för CSS3-stil, textskugga eller välj stilregeln i rullgardinsmenyn.
När namnet visas i vänster sida visas en liten pil till höger.
-
Klicka för att välja pilen till höger om textskuggan.
En ruta visas.
-
Ange X- och Y-förskjutningarna, oskärpa radie och färg.
Webbsidor och resurser för webbdesigners
Erfaren webbdesigners - oavsett om de använder Adobe Dreamweaver eller annan webbdesignprogramvara - hänvisar ofta till online-resurser för att följa upp sina färdigheter och lägga till specialfunktioner på sina webbplatser. Denna lista gör det enkelt för dig att hitta några webbplatser och online-resurser som kan hjälpa dig med dina webbdesignprojekt.
-
Ljud och video värdtjänster:
-
YouTube
-
Vimeo
-
SoundCloud
-
-
Bloggar och CMS-program
-
Blogger
-
Joomla
-
MovableType
-
TypPad
-
Tumblr > WordPress
-
Sociala mediadelningstjänster
-
-
Lägg till detta
-
Lockerz Dela
-
Trafiktrapporteringstjänster:
-
-
Google Analytics
-
Yahoo! Web Analytics
-
HubSpot
-
Populära webbläsare:
-
-
Apple Safari
-
Google Chrome
-
Microsoft Internet Explorer
-
Mozilla Firefox
-
Opera
-
Webbplatstestningstjänster:
-
-
Adobe BrowserLab
-
BrowserShots
-
Cross Browser Testing
-
Browser Sandbox från sked (tidigare Xenocode)
-
Dreamweaver-, CSS- och webbdesignresurser:
-
-
Dreamweaver Developer Center
-
Webdesignutbildning på DigitalFamily. com
-
W3 Konverteringar HTML5 och CSS3 Resurser
-
En lista Apart
-
