Comment apprendre le CSS ? Quels points de connaissances doivent être appris-tutoriel CSS-php.cn

Comment apprendre le CSS ? Quels points de connaissances doivent être appris

巴扎黑

Libérer： 2017-07-31 11:01:02

original

1724 Les gens l'ont consulté

Tout programmeur qui apprend les langages de programmation doit apprendre le HTML et le CSS. Ce ne sont pas des langages de programmation, mais des langages de balisage. Le premier est utilisé pour ajouter la structure de la page Web, et le second est utilisé pour modifier et embellir la structure HTML. Dans cet article, nous nous concentrons sur la façon d'apprendre le CSS.

Si vous voulez bien apprendre le CSS, vous devez d'abord étudier le manuel

Comment apprendre le CSS ? Quels points de connaissances doivent être appris

Il est recommandé d'étudier le Manuel CSS en ligne .

Après avoir étudié le manuel, vous pouvez ensuite étudier l'exemple de tutoriel

Comment apprendre le CSS ? Quels points de connaissances doivent être appris

Il est recommandé d'étudier le Tutoriel d'introduction de base CSS 0 ce qui convient mieux aux novices.

Jetons un coup d'œil aux étapes d'apprentissage :

Syntaxe des pseudo-classes :

selector:pseudo-class {property:value;}

Copier après la connexion

Les classes CSS peuvent également utiliser des pseudo-classes :

selector.class:pseudo-class {property:value;}

Copier après la connexion

http://www.php.cn/ css /css-pseudo-classes.html

2. Déclaration CSS.

<html>
<head>
 <meta charset="utf-8">
 <title>php中文网(php.cn)</title>
 <style>
 p
 {
 border-top-style:dotted;
 border-right-style:solid;
 border-bottom-style:dotted;
 border-left-style:solid;
 }
 </style>
</head>
<body>
<p>两个不同的边界样式。</p>
</body>
</html>

Copier après la connexion

http://www.php.cn/code/3213.html

3. Différentes méthodes d'écriture et unités de valeurs.

<html>
<head>
    <meta charset="utf-8">
    <title>php中文网(php.cn)</title>
    <style>
        body {color:red;}
        h1 {color:#00ff00;}
        p.ex {color:rgb(0,0,255);}
    </style>
</head>

<body>
<h1>这是标题</h1>
<p>这是一个普通的段落。请注意,本文是红色的。页面中定义的默认文本颜色选择器。</p>
<p class="ex">这是一段使用class选择器定义的p。这段文字是蓝色的。</p>
</body>
</html>

Copier après la connexion

http://www.php.cn/code/3148.html

Il y a de nombreux éléments avec le même style dans la feuille de style. Pour minimiser le code, vous pouvez utiliser des sélecteurs de regroupement. Séparez chaque sélecteur par une virgule.

 <style>
 h1,h2,p
 {
 color: #d4d223;
 }
 </style>

Copier après la connexion

http://www.php.cn/code/3241.html

html {
  font-family: sans-serif;
}
 
p {
  line-height: 1.5;
}
 
/*
This rule is not needed ↷
p a {
  line-height: 1.5;
}
*/

Copier après la connexion

http://www.php.cn/css-tutorial-360263.html

<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
div p
{
background-color:yellow;
}
</style>
</head>
<body>
<div>
<p>段落 1。 在 div 中。</p>
<p>段落 2。 在 div 中。</p>
</div>
<p>段落 3。不在 div 中。</p>
<p>段落 4。不在 div 中。</p>
</body>
</html>

Copier après la connexion

http://www.php.cn/code/3287.html

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!