Accueil > Développeur > CSS

CSS pour commencer à pratiquer le premier code du jour pour un projet de page web statique

Source : Internet
Auteur : utilisateur
Créez un compte Alibaba Cloud et obtenez un essai gratuit avec plus de 40 produits. Le compte entreprise peut bénéficier d'un essai gratuit d'une valeur de 1200 dollars US. Inscrivez-vous maintenant !
Ce que nous allons faire aujourd'hui est la page d’accueil index.html

Tout d’abord, le diagramme des effets :

Description : 1. dans le milieu est l’animation SWF. Importer comme suit :

<embed src="images/index.swf" type="" width="712px" height="428px">

2. il y a une entrée lien page-tremplin ci-dessous, qui est blanche (car le lien par défaut est bleu). Décoré avec des tags de lien dans le corps.
Voici un petit peu sur la balise de lien :

≪ Body lien = « Couleur »

Il fonctionne sur tous les éléments dans une page Web qui ne sont pas définis séparément.

≪ Corps alink = « Couleur »

ALink permet de définir la couleur de la souris lorsque vous cliquez sur un lien hypertexte

≪ Corps vlink = « Couleur »

Vlink permet de définir la couleur du texte du lien hypertexte que vous avez accédé

Implémentation de code final :

<body link="white" alink="#0066ff" vlink="#ff0000">

3. la partie inférieure est aussi une image, le code est écrit dans le fichier CSS, comme suit :
Le chemin d’accès suivant explique :... /Is pour aller dans le répertoire précédent. Le chemin d’accès est le suivant :

background: url("../images/copyright.jpg") no-repeat;

Venir ici et obtenir le code à ce sujet.

Index.html premier Code

≪ Html >< tête >< meta http-equiv = « Content-Type » content = « text/html ; Charset = gb2312 « / >< titre >< lien href = » css/index.css « rel = » stylesheet « type = » Text/css " / ≫< / Chef >< body lien = « White » alink = « #0066ff » vlink = « #ff0000 » >< div class = « swf », < embed src = " Images/index.swf « type = » « largeur = » 712px « hauteur = » 428px « >< div class = « entrer », < a href = » url « > entrée < / a & Gt ; < / div >< div class = « End »

Code INDEX.CSS

        *{            margin: 0px;            padding: 0px;        }        body{            background: url("../images/bg.jpg") repeat;        }        .swf {            position: absolute;            left:50%;            top:50%;            margin-left: -356px;            margin-top: -215px;        }        .enter {            width: 100%;            font-size: 18px;            text-align: center;            color:red;            font-weight: bold;            text-decoration: underline;            margin-top: 8px;        }        .end{            width: 574px;            height: 70px;            background: url("../images/copyright.jpg") no-repeat;            margin: 0 auto;        }

Terminer la chose.

Si vous souhaitez également frapper le code manuellement, vous pouvez cliquer pour télécharger le package de compression pour cette page d’accueil index

Au revoir. さよなら...

Cet article est une version anglaise d'un article publié initialement en langue chinoise sur aliyun.com. Il est uniquement fourni à titre informatif. Ce site Web ne fait aucune déclaration ni ne donne aucune garantie, expresse ou implicite, quant à l'exactitude, l'exhaustivité, la propriété ou la fiabilité de l'article ou de toute traduction de celui-ci. Pour toute remarque ou réclamation au sujet de l'article, veuillez envoyer un courriel à l'adresse info-contact@alibabacloud.com en fournissant une description détaillée du problème ou de la réclamation. Un membre de notre équipe vous contactera dans les 5 jours ouvrables. Une fois vérifié, le contenu incriminé sera immédiatement supprimé.

Nous contacter

Le contenu de cette page provient d'Internet et ne reflète pas l'opinion d'Alibaba Cloud ; les produits et services mentionnés sur cette page n'ont aucune relation avec Alibaba Cloud. Si le contenu de la page vous semble problématique, veuillez nous écrire un courriel, nous traiterons le problème dans les 5 jours suivant la réception de votre message.

Si vous constatez des cas de plagiat de la part de la communauté, veuillez envoyer un courriel à : info-contact@alibabacloud.com et fournir des preuves pertinentes. Un membre de notre équipe vous contactera dans les 5 jours ouvrables.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More