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. 【分享】Asp.net Core相关教程及开源项目
			
    入门 全新的ASP.NET:  https://www.cnblogs.com/Leo_wl/p/5654828.html 在IIS上部署你的ASP.NET Core项目: https://www.c ...
    
			
    2. 
						
  2. TCP连接的状态与关闭方式，及其对Server与Client的影响
			
    1. TCP连接的状态 首先介绍一下TCP连接建立与关闭过程中的状态.TCP连接过程是状态的转换,促使状态发生转换的因素包括用户调用.特定数据包以及超时等,具体状态如下所示: CLOSED:初始状态, ...
    
			
    3. 
						
  3. badgeview
			
    https://github.com/AlexLiuSheng/BadgeView include: compile 'com.allenliu.badgeview:library:1.1.1'(ne ...
    
			
    4. 
						
  4. JS开发中常用的小技巧
			
    1.获取指定范围内的随机数 1 2 3 function getRadomNum(min,max){     return  Math.floor(Math.random() * (max - min ...
    
			
    5. 
						
  5. Ubuntu 安装mono
			
    Ubuntu 安装mono 我的系统:Ubuntu 16   Mono参考: http://www.mono-project.com/docs/getting-started/install/linu ...
    
			
    6. 
						
  6. tomcat架构分析和源码解读
			
    最近在看<深入分析java web技术内幕>,书中讲解了一部分tomcat的相关知识,我也去查看了一些源码,看了大神们写的代码,我才知道自己就像在做加减乘除一样,这是不行的.还有好多包和类 ...
    
			
    7. 
						
  7. python 写入Excel
			
     一.安装xlrd模块: 1.mac下打开终端输入命令: pip install XlsxWriter 2.验证安装是否成功: 在mac终端输入 python  进入python环境 然后输入 imp ...
    
			
    8. 
						
  8. windows环境下 php 将office文件(word/excel/ppt)转化为pdf(转)
			
    将office文件转化为pdf的方法有 1.利用openoffice提供的服务 (比较简单,但是转化的效果不太好) 2.使用office提供的服务 (注:这在windows服务器上,并且服务器上面安装 ...
    
			
    9. 
						
  9. apache开启重写模式
			
    现在的好多的框架都使用有路由机制,但是如果在apache下,没有开启重写模式,服务器不会读取路由 所以今天要分享一下apache开启重写模式 ubuntu下: 1.在命令行下 sudo a2enmod ...
    
			
    10. 
						
  10. 唉，可爱的小朋友---（DFS）
			
    唉,小朋友是比较麻烦的.在一个幼儿园里,老师要上一节游戏课,有N个小朋友要玩游戏,做游戏时要用小皮球,但是幼儿园里只有M个小皮球,而且有些小朋友不喜欢和一些小朋友在一起玩,而只喜欢和另一些小朋友一起玩 ...
    
			
    11.