第一部分:
1.meta 标签中:
meta 标签中 <meta http-equvi = "refresh" content="2;URL= https://www.baidu.com "> 页面两秒钟跳转到目标页面
2. a链接
href="#id 名" 猫点 跳转本页 id 名的位置
target =_blank 到新页面打开
3.img
alt 图片加载失败后显示
src 图片路径
title 鼠标悬浮显示的内容
4.form 表单
属性 action ="网址:端口" method = get 或post
input 标签中的属性
type = "text"
passord
单选input 需要设置name属性,name的值做为key ,用户输入的作为value
多选input 需要设置value name 值做key ,value值做value
label 标签 不独立一行,可以夹多个input 或单个input
select 下拉框 需要写name 和value 属性
option
textarea 多行文本
name
rows 行数
cols 列数
5. table 标签中的格式,属性border 设置边框格式,
cellspacing 外边距 内外边框的距离
cellpadding 内边距 内边框距内容的距离
thead - tr - th
tbody - tr -td td中属性 rowspan 跨行,效果表现为竖合并效果 colspan 跨列,效果表现为横合并
第二部分:
一.选择器
后代选择器 div p 子子孙孙
儿子选择器 div>p div里面一层p
毗邻选择器 div+p div同级下面第一个p
弟弟选择器 div~p div 同级下面所有p
伪类选择器
a:link{} 未访问的连接
a:visited{} 已经访问的链接
a:hover{} 鼠标移动到链接上时
a:active{} 鼠标点下去还没抬起来的那一瞬间
伪元素选择器:
frist-letter
p:first-letter{font-size:20px,color:red} 给首字母设置特殊样式
before
p:before {content:"p元素前面的内容,此处要有此属性"}
after和before 类似 都必须要有content内容
选择器的优先级:!important >内联样式>id选择器>类选择器>元素选择器
二. CCS样式
1.font-family :"Microsoft Yahei" ,'Arial' 回退机制,浏览器第一种格式没有识别的话就会去识别第二种格式
2.font-wheigt: inherit 继承父元素字体粗细值
3.text-align 元素中文本的水平对齐方式
4.text-decoration 给文字添加特殊样式
none underline overline line-through inherit
5.首行缩进 text-indent : 32px; 默认一个字在页面大小为16px
6.background:
no-repeat 不平铺
repeat-x,y 水平和垂直方向平铺
background-position :center center ;雪碧图的设置
background :red url("path") no-repeat top right
background-attachment:fixed 固定背景图
边框: border
broder : none dotted 点状虚线 dashed 矩形虚线 solid 实线边框
border-radius 圆角边框效果
display:
none 元素不显示,且不占位置
black 行内元素可以变块元素
inline 块元素可以变行内元素
inline-black 行内和块元素特点
visibility:hidden 隐藏且占位置
盒子模型:
padding 内边距 内容距边框的大小
margin 外边距 盒子之间的间距
padding+margin+border+content 为盒子大小 ,设置padding大小时和撑大盒子,content不会不变
参考资料:https://www.cnblogs.com/clschao/articles/10082587.html