1. css letter-spacing 调节字符间距
  2. css 分割线可以用 div 块,设置背景颜色为分割线颜色,自由调节宽度
<div class="divider"></div>

	.divider {
	  border-bottom: 1px solid #888989;
	  margin: 2px 0;
	  clear: right;
	}
    ```
  1. html meta 常用举例
为搜索引擎定义关键字:
<meta name="keywords" content="HTML, CSS, JavaScript">

定义您的网页的描述:
<meta name="description" content="Free Web tutorials for HTML and CSS">

定义页面的作者:
<meta name="author" content="John Doe">

每 30 秒刷新一次文档:
<meta http-equiv="refresh" content="30">

设置视口以使您的网站在所有设备上看起来都不错(响应式网页设计):
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  1. html title 定义和用法 title 标签在 HTML 文档中是必需的,页面标题的内容对于搜索引擎优化 (SEO) 非常重要.
  2. css display定义和用法
  3. css justify-content justify-content当项目未使用主轴(水平)上的所有可用空间时,该属性对齐灵活容器的项目。
  4. html 表单 form 部分要完全熟悉
  5. html 能实现“标签”功能的有
  • label 标签
  • (若不能使用 label 标签)aria-label (aria-labelledby)属性
  • legend 标签
    标签只是一个辅助功能,不会再页面上展示任何的信息
  1. html 安全的字体设置:第一个值写期望呈现的字体,第二个值写另一种网络安全字体作为后备(fallback)
  2. html 牢记表单输入的最佳实践:为每个输入赋予适当的类型和名称属性。 然后,给第一个输入一个占位符属性。代码示例:
<form method="post" action="https://freecodecamp.org/practice-project/accessibility-quiz">
    <section role="region" aria-labelledby="student-info">
      <h2 id="student-info">Student Info</h2>
      <div class="info">
        <label for="student-name">Name:</label>
        <input id="student-name" type="text" name="student-name" placeholder="Enter name"/>
      </div>
      <div class="info">
        <label for="student-email">Email:</label>
        <input id="student-email" type="email" name="student-email"  />
      </div>
      <div class="info">
        <label for="birth-date">D.O.B.:</label>
        <input id="birth-date" type="date" name="birh-date" />
      </div>
    </section>
  </form>
  • Even though you added a placeholder to the first input element in the previous lesson, this is actually not a best-practice for accessibility; too often, users confuse the placeholder text with an actual input value - they think there is already a value in the input.
  • Instead sthe placeholder text from the first input element, relying on the label being the best-practice.
  1. css 有一种常见的模式可以在视觉上隐藏文本,仅供屏幕阅读器阅读。
    此模式用于设置以下 CSS 属性:
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
  1. html input attribute:
  • id: 标记单个语句
  • value:选项的值
  • name:多个选项分组
  • name 属性规定 input 元素的名称
    name 属性用于对提交到服务器后的表单数据进行标识,或者在客户端通过 JavaScript 引用表单数据
    只有设置了 name 属性的表单元素才能在提交表单时传递它们的值,因为服务端获取表单提交的数据是通过表单元素的 name 属性的值而得到的,没有 name 属性就无法得到表单元素提交给服务端的值
  1. html 表单提交-submit:submit 和 button submit 是 button 的一种形式。submit 的显示文本只能是 submit,用 button 表示可以自定义
  2. html accesskey 当HTML页面有多个元素时,可以通过 accesskey 属性指定激活该元素的快捷键,这样用户通过键盘快捷键就可以激活对应的HTML元素。
    下面示范 accesskey 属性的作用:
用户名(n):<input name=""  type=" text"  accesskey="n"><br/>
密码(p):<input name=""  type=" password" accesskey="p"><br/>
<a href="https://www.baidu.com" accesskey="x">按alt+x跳转</a>