HTML // CSS

HTML常用标签

             // h5声明标签
               // 总盒子
               // 头信息
             // 网页标题（爬虫抓取点）
      // 设置（字符集...）
             // CSS内联样式
                      // 外联文件
                    // 注释
               // 体信息
                        // 横线占行

                        // 空占行
                   // 1~6级标题
               // 文字标签
                     // 段落标签
                         // 标签后加粗
                         // 标签后倾斜
                       // 图片
                     // 小图标

                   // 倾斜 // 有语义--语气
           // 加粗 // 有语义--内容
             // 小字体
特殊符号                     // 字符实体
           // 内联框架
                     // 超链接

文本标签
           // 居中标签
                 // 上标
                 // 下标
                 // 删除线
                 // 代码
               // 包裹代码


...

常用
块元素   --> 布局
                 // 布局盒子
                   // 有序列表
                   // 无序列表
                   // 列表项

                   // 自定义列表
                   // 列表 key
                   // 列表 value

内联元素 --> 样式
               // 行内元素
                     // 输入信息

---

CSS 样式与选择器

xxx {
    color:red;              // 字体颜色
    font-size: 30px/em/rem  // 字体大小
    width:100px;            // 盒子宽
    height:100px;           // 盒子高
    background-color:red;   // 背景颜色
}

/* 元素选择器 */
p {}
/* id选择器 */
#id {}
/* class选择器 */
.cls {}
/* 通配选择器 */
* {}
/* 并集选择器 */
p,#id,.cls {}
/* 复合选择器（交集选择器） */
p.cls {}
/* 子元素选择器（直接） */
div > span {}
/* 后代元素选择器（间接） */
div .cls {}

/* 伪类选择器 */
a:link {}                正常链接
a:visited {}             访问过链接

ie6以上可用以下属性至非a
a:hover {}               悬停
a:active {}              点击

a:focus {}               获取焦点
a:before {}              指定元素前
a:after {}               指定元素后
a::selection {}          选中的元素(复制文本时)
a::-moz-selection {}     兼容火狐写法

p:first-letter {}        首字母
p:first-line {}          首行
p:before {}              之前添加字母

/* 属性选择器 */
p[title="hello"] {}       属性为hello
p[title^="abc"] {}        选择开头
p[title$="abc"] {}        选择结尾
p[title*="abc"] {}        选择结尾  

/* 其他子元素选择器 */
* body>p:first-child {}   第一个孩子
p:last-child {}           最后一个孩子
p:nth-child(odd/even/3n+0) {}  指定位置的子元素(奇偶/公式)
p:first-of-type {}        
p:last-of-type {}
p:nth-of-type {}
p:not(.hello) {}        非选中其他

/* 兄弟元素选择器 */
span + p {}        兄弟后第一个p
span ~ p {}        兄弟后所有的p元素

/* 内联样式      优先级1000  */
/* id           优先级100   */
/* 类           优先级10    */
/* 元素         优先级1     */
/* 通配*        优先级0     */
/* 继承的样式   无          */

---

快捷语法

h1*3            =    

div>span        =