HTML与CSS 学习笔记(一)
HTML:hyperText markup language 超文本编辑语言
charset:编码字符集
常用的编码:
gb2312:中国国家标准低2312条只能识别简体中文
gbk:gb2312的拓展版本,包含了繁体字
unicode:万国码
utf-8: unicode的进阶版本最常用
<html lang = 'en'></html>根标签所有标签元素都包裹在 html标签里面
lang属性:告诉搜索引擎爬虫设计的网站是关于什么内容的 en-->英文 zh-->中文
<em></em>斜体 常用于做染色标签
<del></del> 删除线 eg:淘宝商品原价
<address></address> 一般用于写地址
<div></div> <span></span> :
用法:
1:分块,充当容器让页面更加结构化
2:绑定化操作
回车/空格:英文单词/文本分隔符
< 对应 "<" 英文单词 less than
> 对应 ">" 英文单词 great than
× 乘号
© 版权符号
<ol type =" " reserved = "reserved"></ol> 有序列表
type: 排序类型
reversed:倒序
<ul type = " "></ul> :无序列表
type值:
disc:实心圆(默认)
square:正方形(实心)
circle:空心圆
<img src = "" alt ="" title = "" /> 图片标签
src : 图片路径
alt:当图片地址发生错误无法正常显示图片时,展示一定的信息
title:图片提示符 当鼠标放到图片上时 会自动显示 我们给title属性设置的值
<a href ="" target="_self"></a> 超链接 向href 的路径跳转 默认 _self 形式跳转
<base target = "_blank"/> 该标签的作用为 让页面中所有的链接 都以 "_blank"方式打开 当target值为"_self"时同理
target: 当值为 "_self"在当前页面打开一个页面 当值为"_blank" 时 将会在一个新的页面打开一个页面
作用:
1.打电话 <a href = "tel:xxxxxxxxx"></a>
2.锚点 <a href = "#id"></a>
3.超链接
4.发邮件 <a href = "mailto:xxxx@xxx.com"></a>
5.协议限定符 <a href = "javascript:代码"></a> 强制执行javascript 代码 当 <a href = "javascript: void(0)"></a> 时 a 不跳转
注意点:当 给 href属性为空时 若 这个a标签最页面最底部 点击该a链家包含的元素后 会自动跳到页面最顶部
解决方法:<a href = "javascript: void(0)"></a>
表单标签
<form method = "" action = ""></form>
method:数据传送方式 get/post
get方法传送数据:传送的数据的值会在地址栏上显示出来 post 方式则不会出现这种情况 所以说使用post方式传送表单中的数据较为安全一些
action:数据传送的地址
onfocus:聚焦事件
onblur:失焦事件
<input type = "radio" name = "sex" value = "" checked = "checked">
<label for = "id"></label> :关联input 表单
radio:单选按钮 常用于选择性别 只有当两个type 类型为 radio 的 input元素 的name值一致时 才可以 在两个单选按钮中 只选择一个
checked:默认选中
value:input输入框中的值
checkbox :多选按钮
<select >
<option value = ""></option>
<option value = ""></option>
<option value = ""></option>
...
</select> 下拉菜单
<option></option> 标签相当于value 如果里面有value 将以value为主
<textarea></textarea> 多行文本输入框
表格标签
<table></table> 注意:table 标签一般三参为0 即 border cellspacing cellpadding三个属性的值为 0
<tr></tr> 行
<td></td> 单元格
属性:
cellspacing:单元格与单元格的距离
cellpadding:内容与单元格边框的距离
<th></th> 表头
<caption></caption> 表格标题 为表格内部的额外部分
<thead></thead> 包裹表格头部
<tbody></tbody> 包裹表格主题
跨列合并: colspan = 'n' n 为要合并的列的个数
跨行合并 rowspan = 'n'
合并规则 :先上后下 先左后右
删除的个数 = 合并的个数 - 1

浙公网安备 33010602011771号