这是我参与「第五届青训营」伴学笔记创作活动的第 1 天

学习笔记

对前端的认识

前端是与用户直接进行交互的部分，在浏览器或者移动端上app中呈现给用户的页面展示。
而前端工程师则需要利用相应的编程语言去完善这一切。利用HTML和CSS来构建要建立的页面，用Javascript来实现将用户与页面的操作交互并提高用户的体验。

对HTML的基本学习

HTML全称Hypertext Markup Language，它的语法简单，简而言之就是我们平常所说的网页。浏览器会读取HTML文件，将它们以网页的形式呈现在我们面前。
HTML中，标签是最基本的，分为单标签和双标签。虽然标签不分大小写，但推荐使用小写。
基本形式：

<html> <!-- 根标签 -->

  <head> <!-- 头部标签 -->
  </head>

  <body><!-- 主要内容标签 -->
  
  
  
  </body>
</html>

常用标签以及作用：

1.标题标签：

h1~h6，代表标题大小的不同

2.列表标签：

有序列表

<ol>
        <li>a</li>
        <li>b</li>
        <li>c</li>
  </ol>

无序列表

<ul>
        <li>a</li>
        <li>b</li>
        <li>c</li>
</ul>

自定义列表

<dl> 
    <dt>number</dt>
        <dd>1</dd> 
        <dd>2</dd>
        <dd>3</dd>
    <dt>alpha</dt> 
        <dd>a</dd>
        <dd>b</dd> 
        <dd>c</dd> 
</dl>

3.表单标签：

input

input标签是单标签，输入字段可通过多种方式改变，对应着多种功能，这主要是取决于type属性。
type不同的值对应的不同的效果： text：文本框
password：密码框
radio：单选框
checkbox：复选框
file：文件选择
submit：提交按钮
reset：重置按钮
button：普通按钮

button

button标签是双标签，属性值和input有相似之处，但是比起input的button效果更加灵活。

type有三种类型

submit：提交按钮
reset：重置按钮
button：普通按钮

select

<select name="" id="">
         <option value="" selected>选项1</option>
         <option value="">选项2</option>
</select>

select标签是下拉菜单的整体
option标签是菜单的每一项选项
selected 默认选中项

textarea

可以输入多行文本的标签，而且在右下角可以进行拖拽改变大小。
可以在属性中设置基础的行列，rows和cols。

label

用于绑定内容与表单标签的关系

<label for=""></label>

for的属性值等于表单id的属性值。

以上是今天的总结，感谢大家分享，共同进步。

前端学习01|青训营笔记