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 第一天的更多相关文章
	

    
								
  1. Spark基础学习精髓——第一篇
		
    Spark基础学习精髓 1 Spark与大数据 1.1 大数据基础 1.1.1 大数据特点 存储空间大 数据量大 计算量大 1.1.2 大数据开发通用步骤及其对应的技术 大数据采集->大数据预处 ...
    
		
    2. 
						
  2. 监听器(web基础学习笔记二十二)
		
    一.监听器 监听器是一个专门用于对其他对象身上发生的事件或状态改变进行监听和相应处理的对象,当被监视的对象发生情况时,立即采取相应的行动.监听器其实就是一个实现特定接口的普通java程序,这个程序专门 ...
    
		
    3. 
						
  3. JSTL 标签库 使用(web基础学习笔记十九)
		
    标签库概要: 一.C标签库介绍 1.1.<c:> 核心标签库  JSTL 核心标签库(C标签)标签共有13个,功能上分为4类:1.表达式控制标签:out.set.remove.catch2 ...
    
		
    4. 
						
  4. EL运算符(web基础学习笔记十七)
		
    一.EL语法 1.1.语法结构 ${expression} 1.2.[]与.运算符 EL 提供.和[]两种运算符来存取数据. 当要存取的属性名称中包含一些特殊字符,如.或?等并非字母或数字的符号,就一 ...
    
		
    5. 
						
  5. JSP实现数据保存(web基础学习笔记四)
		
    session对象: //服务端设置Session属性 session.setAttribute("user", username); //客户端接收Session Object  ...
    
		
    6. 
						
  6. Web基础学习
		
    Servlet和Servlet容器.Web服务器概念:https://blog.csdn.net/lz233333/article/details/68065749 <初学 Java Web 开 ...
    
		
    7. 
						
  7. 过滤器(web基础学习笔记二十一)
		
    一.过滤器简介 二.在Eclipse中创建过滤器 三.使用过滤器设置全部web字符编码 public void doFilter(ServletRequest request, ServletResp ...
    
		
    8. 
						
  8. Servlet一(web基础学习笔记二十)
		
    一.Servlet简介 Servlet是sun公司提供的一门用于开发动态web资源的技术. Sun公司在其API中提供了一个servlet接口,用户若想用发一个动态web资源(即开发一个Java程序向 ...
    
		
    9. 
						
  9. Java中执行存储过程和函数(web基础学习笔记十四)
		
    一.概述 如果想要执行存储过程,我们应该使用 CallableStatement 接口. CallableStatement 接口继承自PreparedStatement 接口.所以CallableS ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 深入理解Java类加载器(ClassLoader)
			
    深入理解Java类加载器(ClassLoader) Java学习记录--委派模型与类加载器 关于Java类加载双亲委派机制的思考(附一道面试题) 真正理解线程上下文类加载器(多案例分析) ［jvm解析 ...
    
			
    2. 
						
  2. PXE（preboot execution environment）：【网络】预启动执行环节：引导 live光盘 ubuntu livecd 18.04+：成功
			
    比较艰难的成功了. 艰难在于:吱吱吱吱(知知知知知):就是歌init启动参数而已! 最最艰难在于:这个nfs服务器软件有很大的关系.很多时候不是你不行,而是条件不具备 or 条件看似具备但其实有问题  ...
    
			
    3. 
						
  3. UEditor在asp.netMVC4中的使用，包括上传功能，粘贴表格不显示边框问题
			
    网页编程中在线编辑器的使用还是很重要的,最近研究了一下百度出的UEditor编辑器,把它结合到刚学的asp.netMVC+EF中,同时实现上传资料(包括图片,视频等)功能,下面就以一个最简单的新闻管理 ...
    
			
    4. 
						
  4. python2与python3中除法的区别
			
    python2中的除法 >>>1/2 0 即一个整数(无小数部分的数)被另外一个整数除,计算结果的小数部分被截除了,只留下了整数部分 有时候,这个功能比较有用,譬如在做一些需要取位数 ...
    
			
    5. 
						
  5. Linux 下执行Shell 脚本的方式
			
    Shell 脚本的执行方式通常有如下三种: (1)bash script-name 或者 sh script-name:(2)path/script-name或者./script-name:(3)so ...
    
			
    6. 
						
  6. 0710 mux协议的作用（ppp拨号时如何和gprs进行at指令交互）
			
    ppp拨号使gprs上网的同时如何和gprs模块进行at指令的交互,这是一个问题. 在linux中,ppp拨号上网是内核中支持的,只需要在内核配置中选上. ppp拨号的方式使gprs进行上网与at指令 ...
    
			
    7. 
						
  7. 程序中的@Override是什么意思？
			
    @Override是Java5的元数据,自动加上去的一个标志,告诉你说下面这个方法是从父类/接口 继承过来的,需要你重写一次,这样就可以方便你阅读,也不怕会忘记 @Override是伪代码,表示重写( ...
    
			
    8. 
						
  8. pandas功能使用rename, reindex, set_index 详解
			
    pandas rename 功能 在使用 pandas 的过程中经常会用到修改列名称的问题,会用到 rename 或者 reindex 等功能,每次都需要去查文档 当然经常也可以使用 df.colum ...
    
			
    9. 
						
  9. HttpRequest获得服务端和客户端的详细信息
			
    参考文档:http://blog.csdn.net/u012104100/article/details/43051301 http://blog.csdn.net/u011162260/articl ...
    
			
    10. 
						
  10. FTPService工具类
			
    package com.vcredit.ddcash.server.commons.net; import com.vcredit.ddcash.server.commons.model.FtpPar ...
    
			
    11.