HTML初学|青训营笔记

这是我参与「第四届青训营」笔记创作活动的的第1天，初次学习html，下面是我个人的一些认知与总结

什么是前端

解决GUI人机交互问题
跨终端

PC/移动浏览器
客户端小程序
VR/AR等

Web技术栈

前端技术分为三层：html,css,javascript
html负责页面、结构还有内容，页面中我们可以使用css来更改样式，比如位置、颜色、大小等信息,javascript来定义网页的一些行为，比如用户点了一个按钮之后页面改进行什么样的相应，html、css、javascript都是运行在浏览器里面的，而浏览器则可以通过http协议与服务器进行通信，从服
务器上获取一些数据，将代码渲染成我们看到的页面

前端应该关注哪些方面？

1.美观

主要是布局架构例如流布局，响应式布局以及页面美化css。
主要学习技术css等

2.安全

在传输过程中使用get/post
如何防护例如sql注入等入侵手法
是否在传输过程中容易被抓包而窃取数据

3.性能

尽量保证性能，减少代码冗余，例如选择器公用，JavaScript代码设置对象等
使用算法进行优化代码

4.功能

实现功能的完善

5.无障碍与兼容

多平台，前端优势
多注意兼容性，比方说ie的版本的兼容，以及Android，ios的不适配

标签与属性

这是我个人整理比较常用的一些标签

1.列表标签

无序列表

<ul>
    <li></li>
    <li></li>
</ul>

有序列表

<ol>                          
    <li></li>
    <li></li>
</ol>

结构表格

<dl> 
    <dt>列表头</dt> 
    <dd>列表体</dd> 
</dl>

2.复选框：（单选框将type改为radio）

<lable><input type="checkbox" />水果</lable>
<lable><input type="checkbox" />蔬菜</lable>

3.下拉选择

<select>
    <option>111</option>
    <option>111</option>
</select>

4.输入框提示：

5.引用代码块

<pre><code>
    中间放入引用的代码
</code></pre>

语义化是什么和语义化的好处

语义化是什么

HTML中的元素、属性及属性值都拥有某些含义
开发者应该遵循语义来编写HTML

语义化的好处

代码可读性
可维护性
搜索引擎优化
提升无障碍性

一些心得

第一次的学习都是比较基础的标签和属性，能够很轻易地就上手，并且发现了一个容易忽略的问题，html传达的是内容，而不是样式，样式后面通过css进行修改