Web基础学习---HTML 第一天
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 第一天的更多相关文章
- Spark基础学习精髓——第一篇
Spark基础学习精髓 1 Spark与大数据 1.1 大数据基础 1.1.1 大数据特点 存储空间大 数据量大 计算量大 1.1.2 大数据开发通用步骤及其对应的技术 大数据采集->大数据预处 ...
- 监听器(web基础学习笔记二十二)
一.监听器 监听器是一个专门用于对其他对象身上发生的事件或状态改变进行监听和相应处理的对象,当被监视的对象发生情况时,立即采取相应的行动.监听器其实就是一个实现特定接口的普通java程序,这个程序专门 ...
- JSTL 标签库 使用(web基础学习笔记十九)
标签库概要: 一.C标签库介绍 1.1.<c:> 核心标签库 JSTL 核心标签库(C标签)标签共有13个,功能上分为4类:1.表达式控制标签:out.set.remove.catch2 ...
- EL运算符(web基础学习笔记十七)
一.EL语法 1.1.语法结构 ${expression} 1.2.[]与.运算符 EL 提供.和[]两种运算符来存取数据. 当要存取的属性名称中包含一些特殊字符,如.或?等并非字母或数字的符号,就一 ...
- JSP实现数据保存(web基础学习笔记四)
session对象: //服务端设置Session属性 session.setAttribute("user", username); //客户端接收Session Object ...
- Web基础学习
Servlet和Servlet容器.Web服务器概念:https://blog.csdn.net/lz233333/article/details/68065749 <初学 Java Web 开 ...
- 过滤器(web基础学习笔记二十一)
一.过滤器简介 二.在Eclipse中创建过滤器 三.使用过滤器设置全部web字符编码 public void doFilter(ServletRequest request, ServletResp ...
- Servlet一(web基础学习笔记二十)
一.Servlet简介 Servlet是sun公司提供的一门用于开发动态web资源的技术. Sun公司在其API中提供了一个servlet接口,用户若想用发一个动态web资源(即开发一个Java程序向 ...
- Java中执行存储过程和函数(web基础学习笔记十四)
一.概述 如果想要执行存储过程,我们应该使用 CallableStatement 接口. CallableStatement 接口继承自PreparedStatement 接口.所以CallableS ...
随机推荐
- java interface接口的传值方法
A 类 package interface_test; public class A { private IPresenter ip; public A(IPresenter ip) { this.i ...
- tensorflow中moving average的用法
一般在保存模型参数的时候,都会保存一份moving average,是取了不同迭代次数模型的移动平均,移动平均后的模型往往在性能上会比最后一次迭代保存的模型要好一些. tensorflow-model ...
- 深度学习中交叉熵和KL散度和最大似然估计之间的关系
机器学习的面试题中经常会被问到交叉熵(cross entropy)和最大似然估计(MLE)或者KL散度有什么关系,查了一些资料发现优化这3个东西其实是等价的. 熵和交叉熵 提到交叉熵就需要了解下信息论 ...
- svn中status为missing的文件的处理方式
svn中status为missing的文件在每次commit时都会出现在待提交的列表里,而且它的上级文件夹前面有个红色的点,有碍观瞻,处理方式也很简单: 1.在待提交的列表里,右击该文件->de ...
- javascript与jquery的区别
- MySQL数据查询
数据查询语言DQL select [all | distinct] 字段或表达式列表 [from子句] [where子句] [group by子句] [having子句] [order by子句] [ ...
- sqoop/1.4.6/下载
http://archive.apache.org/dist/sqoop/1.4.6/
- 悬线法 || BZOJ3039: 玉蟾宫 || Luogu P4147 玉蟾宫
题面: P4147 玉蟾宫 题解:过于板子举报了 #include<cstdio> #include<cstring> #include<iostream> #de ...
- 20175320 2018-2019-2 《Java程序设计》第3周学习总结
20175320 2018-2019-2 <Java程序设计>第3周学习总结 教材学习内容总结 本周学习了教材的第四章的内容.在这章中介绍了面向对象编程的概念以及Java编程中的类与对象, ...
- css学习_css用户界面样式
1.css用户界面样式 a.鼠标样式(记住几个兼容性好的) cursor:default/pointer/move/text; b.轮廓 outline outline:2px solid red: ...