HTML
设置背景:
<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">
1 域名解析
# 域名解析
域名解析是把域名指向网站空间IP,让人们通过注册的域名可以方便地访问到网站的一种服务。IP地址是网络上标识站点的数字地址,为了方便记忆,采用域名来代替IP地址标识站点地址。域名解析就是域名到IP地址的转换过程。域名的解析工作由DNS服务器完成。
域名解析也叫域名指向、服务器设置、域名配置以及反向IP登记等等。说得简单点就是将好记的域名解析成IP,服务由DNS服务器完成,是把域名解析到一个IP地址,然后在此IP地址的主机上将一个子目录与域名绑定。
互联网中的地址是数字的IP地址,域名解析的作用主要就是为了便于记忆。
域名--ip -- 192.168.14.00
http://192.168.14.00 --www.jd.com --DNS解析
{'www.jd.com':'192.168.14.00'}
2 请求和响应
请求:浏览器客户端(server)给服务端发信息
响应:服务端给客户端(server)回信息
3 标签
Html标签:超文本标记语言,就是标记用的。
<meta/> # 自封闭的
<h1></h1> # 全封闭的
标签属性 id='xx' asgdsg='xxx'
<h1 id='xx' asgdsg='xxx'>
1.
4 标签的分类
-
分为两类
-
内敛标签(行内标签):不独占一行,内敛标签只能嵌套内敛标签【b\i\u\s\button\span\img\a】
-
块级标签(行外标签):自己独占一行,可以嵌套内敛标签和某些块级标签【\h1-h6\br\hr\p\div】
-
p标签:不能嵌套p标签,也不能嵌套块级标签
-
1. head标签中的标签
<title></title> 定义网页标题
<meta/> 定义网页原信息、配置信息(了解)
2. boby标签中的基本标签
div标签和span标签(常用)
这两个标签是没有特别的样式的。<div>xxxx</div>,但是这是两个标签最大的特点,可以通过CSS来控制,就像咱们画画一样,在一个白纸上画好,还是在一个报纸上画好啊,对不对。打开个网页通过f12看一下,就发现多数都是div和span。
div标签用来定义一个块级元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现。
span标签用来定义内联(行内)元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现。
块级元素与行内元素的区别:
所谓块元素,是以另起一行开始渲染的元素,行内元素则不需另起一行。如果单独在网页中插入这两个元素,不会对页面产生任何的影响。
这两个元素是专门为定义CSS样式而生的。
刚才学的标签:
块级标签:p、h1--h6、hr、div
内联标签:b、i、u、s
注意:
关于标签嵌套:通常块级元素可以包含内联元素或某些块级元素,但内联元素不能包含块级元素,它只能包含其它内联元素。div是可以包含div的
<b>加粗</b>
<i>斜体</i>
<u>下划线</u>
<s>删除</s>
<p>
段落标签 # 独占一个段落
</p>
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
<!--换行-->
<br>
<!--水平线/分割线-->
<hr>
2.1 img标签
图片标签
属性 src='图片路径' 网络地址的绝对路径|本地相对路径
属性 alt="图片未加载成功的提示信息"
示例:
<img src='1.jp' alt="这是一个美女图片,请稍等..." title="鼠标悬浮的提示信息" width="200" height="200">
width 指定宽度多少
height 指定高度是多少
2.2 a标签 超链接标签
属性
hred:超链接的地址
target:是否新建窗口
target="_self" 当前窗口打开某个路径对应的html页面
target="_blank" 新建窗口打开某个路径对应的html页面
示例:
<a href="https://www.baidu.com" target="_blank">百度</a>
2.3 列表标签
无序列表:
<ul type="none">
<li>太白</li>
<li>alex</li>
<li>景女神</li>
</ul>
有序列表:
<ol type="a" start="2">
<li>大壮</li>
<li>b哥</li>
<li>wusir</li>
</ol>
2.4 标题列表标签
<d1>
<dt>标题1</dt>
<dd>内容</dd>
<dt>标题2</dt>
<dd>内容1</dd>
<dd>内容2</dd>
</d1>
2.5 特殊符号
空格:
小于号:<
大于号:>
&符号:&;
¥ :¥
版权标识(写公司网站的时候会用到):©
注册(一个圆圈里面有个R):®
2.6 表格标签(重点)
table
cellpadding:文字和内边框的距离
cellspacing:内边框和外边框的距离
<table border="1" cellpadding="10" cellspacing="20">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>爱好</th>
</tr>
</thead>
<tbody>
<tr>
<td>b哥</td>
<td>40</td>
<td>炒鸡蛋</td>
</tr>
<tr>
<td>大壮</td>
<td>38</td>
<td>抽烟喝酒烫头</td>
</tr>
</tbody>
</table>
3. form 标签
-
表单标签和input标签,用户输入或者选择使用的标签
action:指定数据提交路径
input标签:
type属性:控制输入框的样式的
name属性:分组,携带数据的key key:value
value:选择框提交数据的时的值,输入框的默认值
input type属性的值:
text 单行输入文本 <input type="text" />
password 密码输入框(不显示明文)<input type="password" />
date 日期输入框 <input type="date" />
checkbox 复选框 <input type="checkbox" checked="checked" name="x" />
radio 单选框 <input type="radio" name="x" />
submit 提交按钮 <input type="submit" value="提交" /> #发送输入浏览器上输入标签中的内容,配合form表单使用,页面会刷新
reset 重置按钮 <input type="reset" value="重置" /> # 页面不会刷新,将所有输入的内容清空
button 普通按钮 <input type="button" value="普通按钮" />
hidden 隐藏输入框 <input type="hidden" />
file 文本选择框 <input type="file" /> (等学了form表单之后再学这个)
<form action="http://127.0.0.1:8001">
用户名:<input type="text" name="username" value="dazhuang">
密码: <input type="password" name="password" value="111">
<input type="radio" name='sex' value='1'>男
<input type="radio" name="sex" value="2">女
<input type="checkbox" name="hobby" value="a">喝酒
<input type="checkbox" name="hobby" value="b">抽烟
<input type="checkbox" name="hobby" value="c">烫头
<input type="submit">
<hr>
<input type="date">
<input type="button" value="普通按钮">
<input type="reset">
<input type="hidden">
<input type="file">
</form>
form 表单触发提交数据的操作,必须写在form表单标签里面,写在外面就是普通按钮。
<input type="submit">
<button>提交按钮</button>
input的其他属性
checked 默认选中
<input 