1、前端-html

前端(三剑客)

  1. html 内容输出
  2. css 格式渲染
  3. javascripts 动态效果

http协议

http协议的由来:根据软件开发架构,一般软件都是cs或者bs架构,bs本质上也是一种cs架构。
如果是cs架构,开发者可以自定义报文的头部即自定义协议。如果是bs架构,为了适用于所有的软件,browers定义了一种标准,这种标准就是http(超文本传输协议)

http协议的组成及其特点

组成
请求首行 --请求方法、http协议版本
请求头部 --kv键值对
\r\n
请求体


响应首行 —状态码
响应头部
\r\n
响应体

五大特点:

  1. 基于请求响应
  2. 基于tcp/ip作用于应用层之上的协议
  3. 无状态(cookies、sessions、token)
  4. 无/短链接(websocket)

状态码的含义:
1xx: 服务端正在处理你的请求,客户端可以再次发送请求
2xx: 服务端已经响应客户请求
3xx: 链接的重定向
4xx: 请求错误(请求资源不存在,请求语法错误等)
5xx:: 服务器内部错误

http的请求方式:
get请求:向服务端要数据
post请求:向服务端发送数据

**url:**统一资源定位符

html–超文本标记语言()

注释方式



html代码结构

<!DOCTYPE html>
<html>
	<head>head>  head内主要是给浏览器看的
	<body>body>  body内主要是给浏览器解释给用户看的
html>

html常用标签

head内常用标签

<title>定义网页标题title>
<style>定义内部样式style>
<scripts>定义js或者引入外部js样式scripts>
<link/> 引入外部样式文件或者网站图标
<meta> 定义网站源信息,其中有些属性常用:http-equiv、name(description、name)

body内常用标签

<b>加粗b>
<i>斜体i>
<u>下划线u>
<s>删除线s>

<p>段落标签p>

<h1>一级标题h1>
<h2>二级标题h2>
<h6>六级标题h6>
<br/>换行
<hr/>水平线

特殊字符

>  >
<  <
¥ ¥
空格  
@  ©
注册  ®

div:块级标签,无实际的意义,为css而生
span:行内标签,无实际的意义,为css而生
注意:p标签是块级标签,但是p标签不能包含块级标签和p标签

img标签
<img src="图片路径" alt="图片未加载成功是显示的提示" title="鼠标悬浮时的提示" width="" height="" (调整其中一个将等比缩放)>
a标签
<a href="链接" target="是否另起一个页面加载内容">
href中的链接可以是网页链接、本地文件、本网页中的某个位置(锚)
target中可以是_blank、_self

列表、标题列表、表格

列表(有序列表和无序列表)
有序列表
<ol type="1" start="2">  #type可以定义有序列表的序号类型(1、A、I),start可以定义从什么位置开始
	<li>内容一<li>
ol>
无序列表
<ul type="disc">   #type可以定义无序的头部标记,默认是disc实心的
	<li>内容li>
	<li>内容li>
ul>
标题列表
<dl>
	<dt>标题1dt>
	<dd>内容1dd>
	<dt>标题2<dt>
	<dd>内容2<dd>
dl>
---------------
表格
<table>
	<thead>
		<tr>
		<th>nameth>
		<th>ageth>
		<th>favoritesth>
		tr>	
	thead>
	<tbody>
		<tr>
		<td>lzztd>
		<td>27td>
		<td>footballtd>
		tr>
	<tbody>
table>
表格常见属性:
border:表格边框
cellpadding:内边距
cellspacing:外边距
rowspan:单元格竖跨多少行
colspan:单元格横跨多少行

form表单:表单是html中较为复杂的一部分,表单是为了将用户提交的数据给到后端服务器,实现用户和web服务器的交互
表单包含input系列标签(包括单选框、复选框、文本字段、提交按钮)、还包含textarea、select、fieldset、label等标签

input标签
<form  action="" method="" name="">  #action定义表单将提交到什么地方,method定义提交表单的http方法,name规定识别表单的名称
	<input type="text"value="姓名"/>  #input会根据type的不同类型变化为多种形态。text、password、date、checkbox(复选框)、radio、submit、reset、button、hidden、file
form>

select标签
<form action="" method="">
	<select name="city" id="city">   #multiple定义是多选属性、value定义提交时的选项值
		<option value="1">chineseoption>
		<option selected="selected" value="2">englishoption>
	select>
form>

lable标签:为input元素定义标记,不会向用户提供任何效果
<form>
	<label for="username" >姓名label>  #为input输入的内容提供提示信息
	<input type="text" id="username"/>
form>

textarea标签
<form>	
	<textarea name="" id="" cols="" rows="" >请输入内容textarea>	
form>


你可能感兴趣的:(前端,html5,http,前端)