Web基础学习---HTML 第一天

1 HTML标签
2、CSS
Web开发基础
HTML
好吧离开Python几天。。。
如何学好前端？？

多去看别人的网站、多看、多写、多练，(知乎、36Kr、)
多练就好
前端是啥、为什么要学、如何学

======从零开始=====千万别掉队====
1、标签有些不需要用的、20个基础，其余的浏览
2、学不好，就是在给自己挖坑

HTML
   1、一套规则，浏览器认识的规则。
   2、开发者：
      学习Html规则
      开发后台程序：
         - 写HTML文件（充当模板的作用）
         - 数据库获取数据， 然后替换到html文件的指定位置(web框架)
   3、本地测试
      - 直接浏览器打开
      - pycharm
   4、编写html文件
      - doctype 对应关系
      - html标签: 标签内部可以写属性
      - 注释： <!— 注释内容 —>
   5、标签分类
      - 自闭合标签 <meta charset=“UTF-8”>
      - 主动闭合标签<a></a>

   - 20 个标签
CSS
   - 颜色
   - 位置
   - 。。。

20个标签？是啥。。

格式：
<!DOCTYPE html> # 这里是对应关系 <html lang="en"> # html标签 <head>     <meta charset="UTF-8">     <title>Title</title> </head> <body> <div>     abc </div>  </body> </html>

一、<head>标签:
   - <meta>: 刷新、跳转，编码，关键字、描述、IE兼容
      <meta http-equiv=“X-UA-Compatible” content=“IE=IE9;IE=IE8” />
   - title标签
   - link, 图标
       <link rel="shortcut icon" href="https://static.zhihu.com/static/favicon.ico" type="image/x-icon" />
   - style
   - script
********下面的需要记住了了， 上面的不需要。*****
二、body
  1、各种符号
   图标：$nbsp;   $gt;  $lt;
      http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
  2、段落<p></p>，段落之间有间隔
  3、换行 <br />  <br>       <!— 自闭合可以加/或不加，所有标签不区分大小写 —>
  4、标题：h1   h6
  5、span，本身无特性，对CSS这些来说使用方便

所有标签分为：
块级标签：占用整行，H系列(加大加粗)、P标签(段落和段落之间有间距)
行内标签(内联标签)：有多少占多少。span(白板)

  6、DIV，块级，这个通过CSS几乎可以构造出所有的功能、CSS可以将块级、行内相互转换，
   * div+css \ span+css， 完全可以的，只不过可能div+css是第一个人提出来的，所以普遍都是div
7、标签嵌套：
     标签存在的意义：定位操作，CSS操作，JS操作
   chrome 审查元素的使用
      - 定位
      - 查看样式

8、表单<form action=“http:….” method=“POST” >
   <input />. type=text，password，button，submit, reset
         type = “radio” 单项先择
         name=“user”, value=“值”
   submit 提交表单信息(Input)

GET\POST何方妖孽：
发送的数据有两部份：1、请求头，2、请求数据
Get在url里，post在body里、在内容里，它们没有安全这一说

GET:

POST

单选框：<input type=“radio” name=“gender” value=“1” />. name相当于分组了，同名的为一组 (同名互斥)
复选框：<input type=“checkbox” /> name属性（批量获取数据）
文件: <input type=“file” name=“put filename” /> 上传文件， 默认文件是发不过去的。依赖表单的属性(enctype="multipart/form-data"
)，表示一点一点的发送的服务器。
多行文本： <textarea name=“content” >default value </textarea>
下拉框：<select name=“address”></select>,   size=3，下拉列表框，multiple多选

<select name="address">     <option value="1">SH</option>     <option value="2" selected=“selected”>BJ</option> </select>
<select name="address" size="3" multiple="multiple">
option分组
<optgroup label="China">     <option value="3">xx</option> </optgroup>

******能提交到后台的数据数*****END******
  9、超级链接 a标签
   - 跳转
   - 锚点 <a href=“#333”>xxx</a> 跳到当前页面的id=333位置

  10、图片域<img>
   - src
   - alt
   - title
  11、列表<ul> </ul> 这个听说可以忽略、后期都是用CSS改样式
   - <li></li>
   - <ol><li></li> </ol>
   - <dl> </dl>
      - dt.  Dd
  12、表格table tr td th
   - thread 这个里面的字段只能是th了，定义表头
      tr th
   - <tbody>  </tbody>
      tr td
   - 合并单元格
      - tr rolspan
      - td colspan
  13、label 通常与input合用，
   用于点击元素，使得关联的标签获取光标
   <label for="username">用户名:</label>     <input id="username" type="text" />

  14、filedset  几乎不用, 在一框上有字
   - legend

#终于弄完了标签了
=======
秒客网

Web基础学习---HTML 第一天

相关文章
