学习HTML5&CSS的一点记录（一）

所学标签意思

• h1…一级标题
• p…段落正文
• p…段落正文
• color…颜色
• font-size: 30px; …字体大小：30像素
• font-family: Sans-serif;…字体样式：…
• alt 属性中的文本用于屏幕阅读器以提高可访问性，并且如果图像无法加载，则会显示。
  -width…宽度
• border-color: red; …边框颜色
• border-width: 5px; …边框宽度
• border-style: solid; …边框样式
• border-radius:50%或者50px…边框半径
• action属性的值指定了表单提交到服务器的地址。
• submit…提交

所学模板

1. 更换标题颜色
   <.h2 style=“color: ?”>内容<./h2>

2. 添加类选择器来更换颜色
   <.h2 class=“一个标记”>内容<./h2>
   <.syle>
   选择器 {属性名称: 属性值;}
   h2 {color: red;}
   或者，一个标记{属性名称: 属性值;}
   .red-text
   {color：red；}
   <./style>

3. 引入
   <.link href=“网址” rel=“stylesheet” type=“text/css”>

4. 多字体降级
   p {
   font-family: 一种, 第二种;
   }

5. 添加图片
   <.img src=“网址”> <.img src=“网址”>
   <.img src="网址"alt=“无法加载时的描述文字”>

6. 添加外部链接
   <.a href=“网址”>链接文字<./a>

7. 添加文本内部链接
   <.p>文字说明 <.a href=“网址”>文字说明<./a>文字说明 <./p>

8. 将图片设置为链接
   <.a href="#"><.img src=“网址”><./a>

9. 创建项目符号无序列表
   <.ul>
   <.li>milk<./li>
   <.li>cheese<./li>
   <./ul>

10. 创建有序列表
    <.ol>
    <.li>Garfield<./li>
    <.li>Sylvester<./li>
    <./ol>

11. 创建文本输入框
    <.input type=“text”>

12. 为文本输入框设定预定值
    <.input type=“text” placeholder=“提示文字”>

13. 添加表单
    <.form action=“表单提交到服务器的地址”><./form>

14. 为表单添加提交按钮
    <.button type=“submit”>提交<./button>

15. 把表单设置为必填
    <.input type=“text” required>

16. 添加单选框
    <.label><.input type=“radio” name=“indoor-outdoor”> 选项名称1<./label>
    <.label><.input type=“radio” name=“indoor-outdoor”> 选项名称2<./label>
    …

17. 添加复选框
    <.label><.input type=“checkbox” name=“personality”>选项名称1 <./label>
    <.label><.input type=“checkbox” name=“personality”>选项名称2 <./label>
    …

18. 使用checked属性设置复选框和单选框默认被选中
    <.input type=“radio” name=“test-name” checked>

未完，慢慢补充。。。。。