Html&CSS总结
1. Web基础
1.1两种模式C/S和B/S
C/S即客户端开发模式
B/S即部分事务逻辑在前端实现,主要事务逻辑在服务端实现
1.2、开发工具IDE
2. HTML文档结构
<!DOCTYPE html>定义文档类型
<html>定义html文档
<head>定义文档头部
引用脚本,指示浏览器在哪里找到样式表,提供源信息等;定义文档的各种属性和信息
<base>为页面 上的所有链接规定默认地址或默认目标
<meta> 提供有关页面的信息,关键字,编码模式,兼容性模式设置,页面缩放等
<link> <script> <style> <title>
<body>定义文档主体
3.文本标签
标题标签H1-H6
字体标签: <b>、 <strong>-加粗、 <sup>-上标、<sub>-下标、 <s> -删除线、<u>-下划线、 <i>、 <em> 斜体、
<code>-代
码、<cite>-引用
格式化标签: <p> 段落标签、<br> 换行、<hr> -分隔线、<pre> 预格式化
4.链接标签
Href
、图片路径、文件路径、网址、锚点
Target
i. _ self、 _ blank、_ parent、_top、[name]
5.图片标签
src图片路径
alt无效替代
6.列表
无序列表ul-li
type属性: circle、disk、square
有序列表o1-li
type属性: 1/i/l/a/A
自定义列表dl-dt-dd
7.表格
Table tr td th-单元格加粗
合并: colspan-跨列、 rowspan-跨行
扩展样式:
(table+ 宽高td+边框)
boder-collapse
1) separate-默认值, 边框会被分开
collapse-如果可能, 边框会被合并成一个单一的边框,会忽略spacing和empty-cells的值
boder-spacing:[length]
1)
规定相邻单元的边框之间的距离,使用px、em等单位,不允许使用负值
定义1 个length参数,定义的是水平和垂直的间距
定义2个length参数, 定义的是第1个为水平,第2个为垂直的间距
8.表单
form标签;action-后端地址,method-提交方式
侧重于与后端发送数据,以input标签为主,以name属性为辅,通过form表单向后端发送数据
标签属性
type: text、count、date、button、 radion、 checked、 hidden、 submit
name: 设置的值必须和后端接收的前端数据的参数名称-致
value: 显示在页面的值
9. Iframe
Frameset
iframe中的name属性配合 a标签中的target属性使用
iframe的src属性 加载新页面
10. div-span
div块状容器
span行级容器
11. 文本标签
placeholder-h5提示 required-h5必需字段
2、CSS
1. CSS选择器
基本选择器:ID
、类选择器
、标签选择器
、其他选择器、.classname空格div当前元素所有后代元素子子孙孙
ii. .classname>div 当前元素下一级所有子元素-只有子代
.classnameA~.classnameB当前节点A之后的元素B
伪类选择器
:
:hover鼠标经过时设置其样式
:active 鼠标按下时设置其样式
:visited 选择已访问的链接,并设置其样式针对a标签
2. CSS优先级
style属性>ID选择器 >class选择器>标签
b.就近原则,同级别选择器则取最新属性生效
3.盒子模型
盒子水平排列-margin无重合
盒子垂直排列-margin重合
盒子样式
boder: 1 px dashed #red
Padding:1px 1px 1px 1px顺时针方向,从上开始
Margin:O auto

浙公网安备 33010602011771号