Recent Posts
Css基础
一、语法 样式语法
选择器 { 属性名: 属性值; /*注释*/ } at语法
@charset "UTF-8"; @import url(style.css); @media (min-width: 100px) and (max-width: 200px) { 语法一 } 注意事项： @charset必须放在第一行
at语法必须以分号;结尾
所有符号都是英文符号，区分大小写
二、css调试 使用vscode看颜色 使用WebStorm看颜色 使用开发者工具看警告 border调试法:
- 怀疑某元素有问题就给其加border - border没出现？说明选择器错了或者语法错了 - border出现？看看边界是否符合预期 - bug解决后把border删掉 Example: 段落p背景颜色不显示，使用border调试
<style> p{ background:black color:red; } </style> <p>你好</p> 三、资料查找 Google 关键字 MDN flex mdn CSS tricks flex css tricks
read more
HTML常用标签
一、a 标签 属性 href、target、download、rel=noopener
<a href=" "></a> href的取值
网址
<a href="https://fanison.info"></a> <a href="http://fanison.info"></a> <a href="//fanison.info"></a> 路径
<a href="./posts/index.html"></a> 伪协议
<a href="javascript:;">Click</a> <a href="javascript:alert(1);">js伪代码</a> <a href="mailto:yafanison@gmail.com">发邮件给我</a> <a href="tel:18312345678">Call Me</a> id
<a href="#id">Call Me</a> target的取值
<a href="http://fanison.info" target="_blank">新窗口打开</a> <a href="http://fanison.info" target="_self">当前页面加载</a> _parent: 加载响应到当前浏览上下文的父浏览上下文 _top:加载响应进入顶层浏览上下文
download：下载页面
二、 tabel 标签 <table> <thead> <tr> <th>姓名</th> <th>性别</th> </tr> </thead> <tbody> <tr> <td>小米</td> <td>男</td> </tr> <tr> <td>苹果</td> <td>女</td> </tr> </tbody> <tfoot> <tr> <td>x</td> <td>y</td> </tr> </tfoot> </table> - border-collapse 用来决定表格的边框是分开的还是合并的。在分隔模式下，相邻的单元格都拥有独立的边框。在合并模式下，相邻单元格共享边框。 - border-spacing 属性指定相邻单元格边框之间的距离
read more
HTML入门笔记1
1. HTML 起手式 新建demo-->新建html--><!DOCTYPE html> 2. 全局属性 style 元素CSS样式声明
<style> style{display:block;} #xxx{ color:green; } </style> 使得style可见，前提需将style放入body中 - class 类名列表
<style> [class="hder"]{ color:red; } .hder{ color:green; } </style> <header class="hder">这是我的html笔记</header> 如果class有多个属性，则[class="属性"]需写入全部属性才可匹配对应的class，使用 .属性方式写入class的某一个属性即可匹配class - contenteditable 元素是否可被用户编辑 hidden 隐藏元素 id 唯一标识符 不到万不得已不使用id，id不报错
tabindex 整数属性，指示元素是否可以获取输入焦点（可聚焦），是否应该参与顺序键盘导航 正值通过顺序键盘导航进行聚焦和访问,0 表示最后访问，-1表示不可通过键盘导航到达 title 表示与其所属元素相关信息的文本 3.章节标签 章节 <section> 表示文档中的一个区域（或节），比如，内容中的一个专题组，一般来说会有包含一个标题（heading）。一般通过是否包含一个标题 (- element) 作为子节点 来 辨识每一个。”) 定义文档中的一个章节 <h1>,<h2>,<h3>,<h4>,<h5>,<h6> 六层文档标题，<h1> 最大,<h6> 最小 <article> 可以独立于内容其余部分的完整独立内容块 <p> 定义一个段落 <header> 定义页面或章节的头部 <footer> 定义页面或章节的尾部 <main> 定义文档中主要或重要的内容。 <aside> 定义和页面内容关联度较低的内容 <div> 是一个通用型的流内容容器，它在语义上不代表任何特定类型的内容，它可以被用来对其它元素进行分组，一般用于样式化相关的需求（使用 class 或 id 特性) 或者对具有相同特性的一组元素进行分组 (比如 lang)，它应该在没有任何其它语义元素可用时才使用 (比如 或 ) 。”) 代表一个通用的容器 4.
read more