基础Html重点——防健忘

2021-04-26 08:27

阅读:545

标签:ref   str   aaa   选择   amp   nbsp   back   大于   code   

一、head标签重点

head>
    meta charset="utf-8">
    title>第二天课title>
    
    meta name="keywords" content="护士,教师,空姐">
    
    meta name="description" content="各种服饰应有尽有">
    
    meta http-equiv="refresh" content="3;url=https://www.baidu.com/">
head>

 

二、字符实体
<——小于
>——大于
 ——空格

 

三、常见文本标签
——粗体
——下划线
——斜体
——删除线
——强调(粗体)

 

四、锚点标签

body>
    h3 id="top">h3>
    a href="#one">第一章a>
    a href="#two">第二章a>

    h4 id="one">第一章h4>
    p style="width: 600px;height: 400px;background-color: blue;">p>
    h4 id="two">第二章h4>
    p style="width: 600px;height: 400px;background-color:yellow;">p>
    a href="#top">返回a>
body>

 

五、表格基础
1、跨行:rowspan
2、跨列:colspan
3、表格标题:


4、表格头部:
5、行与列:

 

六、样式选择器

1、ID选择器

head>
style>
#one{color:red;}
style>
head>
body>
label id="one">样例1label>
body>

2、Class选择器

head>
style>
.one{color:red;}
style>
head>
body>
label class="one">样例2label>
body>

3、标签选择器 

head>
style>
p{color:red;}
style>
head>
 body>
p>样例3p>
body>

七、样式位置

1、外链样式

1)style.css

#one{color:red;}
.one{color:yellow;}
p{color:blue;}

2)index.html

DOCTYPE html>
html>
    head>
        meta charset="utf-8">
        link href="./style.css" rel="stylesheet" type="text/css">
    head>
    body>
        input id="one">
        input class="one">
        p>p>
    body>
html>

2、内置head标签中

head>
style>
#one{color:red;}
style>
head>
body>
label id="one">样例1label>
body>

3、关系选择器

style>
    ul li{color:pink;}    /*(包含)后代选择器*/
    ul>li{color:balck;} /*父子选择器*/
    ol+li{color:red;}    /*相邻选择器(向下相邻)*/
    ol~li{color:blue}    /*兄弟选择器(向下的兄弟)*/
style>
body>
    ul>
        li>111li>
        li>222li>
        ol>
            li>aaali>
            li>bbbli>
            li>cccli>
        ol>
        li>444li>
        li>555li>
        li>666li>
    ul>
body>

4、选择器优先级

标签内style > ID选择器 > 类选择器 >标签选择器 > 标签原有选择器

 

 

 

 

 

待补充……

基础Html重点——防健忘

标签:ref   str   aaa   选择   amp   nbsp   back   大于   code   

原文地址:https://www.cnblogs.com/HymanWesteros/p/12222031.html


评论


亲,登录后才可以留言!