daily commit

2022-06-27 17:10:03 +08:00
parent ef02128887
commit 3950a2392d
2 changed files with 103 additions and 1 deletions
--- a/css/css.md
+++ b/css/css.md
@@ -0,0 +1,102 @@
 # CSS
 - ## css选择器
  - 根据标签名选择
    ```css
    <!-- 
        多个标签类型之间可以用逗号隔开
     -->
    h1,p,li {
        color:red;
    }  
    ```
  - 根据class进行选择
    - 通过class属性来进行选择
    ```css
    .disk-block {
        border:1px black dashed;
    }   
    ```
    - 通过标签名和class同时来进行选择
    ```css
    li.pink-css,div.pink-css {
        color:pink;
    }
    ```
  - 后代选择器
    - 后代选择其会根据标签的位置来进行选择,多个标签之间通过空格隔开
    ```css
    li em {
        font-style: italic;
    }
    li span.pink-style {
        color:pink;
    }
    ```
  - 相邻兄弟选择器
    - 相邻兄弟选择器会选择其相邻的下一个兄弟节点
    ```css
    li + li {
        color:red;
    }
    ```
  - 子选择器
    - 相比与后代选择器，子选择器只会选择其节点的直接后代，间接的后代不会被选中
    ```css
    li > em {
        color:pink;
    }
    ```
 - ## css使用方法
  - 引用外部css文件
  ```html
  <head>
    <link rel="stylesheet" href="style.css">
  </head>
  ```
  - 内部样式
  ```html
  <head>
    <style>
        p {
            color: red;
        }
    </style>
  </head>
  ```
  - 内联样式
    ```html
    <p style="font-size:1.5em;color:red;">Hello</p>
    ```
 - ## 多条样式规则应用于同一个元素
  - 多个样式规则的选择器范围相同
    - 在选择其范围相同的情况下，后出现的选择器样式会覆盖先前出现的选择器样式
    ```css
    p {
        color:red;
    }
    p {
        color:blue;
    }
    /* 后出现的p样式会覆盖之前出现的p样式，最终颜色为blue */
    ```
  - 多个样式规则的选择器范围不同
    - 如果多个样式的选择器范围不同，那么范围更小更特殊的选择器样式胜出
    ```css
    .red-p {
        color:red;
    }
    p {
        color:blue
    }
    /* 此时类选择器比元素选择器更特殊，故而最终颜色为red */
    ```
  - 在同一个选择器中重复指定样式
    - 在同一选择器中重复指定样式，位于后面的样式会覆盖位于前面的样式
    ```css
    p {
        color:blue;
        color:red;
    }
    ```
--- a/html/html基础.md
+++ b/html/html基础.md
@@ -6,7 +6,7 @@
    - 在html中，< > ' " 都是特殊的符号，其都是html语法的一部分，故而在文本中如果存在这些特殊字符，可以通过特殊的引用来表示该特殊字符
    - 特殊的用来表示该类字符的表达式以&开头，以；结尾，具体如下
    ```shell
-    <div   可以用  &lt; (less than)
+    <   可以用  &lt; (less than)
    >   可以用  &gt; (greater than)
    "   可以用  &quot; 
    '   可以用 &apos;