python技术开发证书,python有什么证书
作者:互联网
最近学习Python,网上学习资料挺多的,这篇写的不错,关于python技术开发证书和python有什么证书,大家有需要也可以看看。
知识点预习
1.表单2.元素类型
3.浮动
4.定位
01- 表单
form标签 表单用来提交数据
action 要提交的网址,默认是当前网页
method 请求 提交方式
默认get请求
post请求
切换请求方式时注意缓存问题
label标签
for属性如果设置的值和 input标签中设置的id属性值一样就可以实现点击label让对应的input成为焦点
输入框的两个常用属性:
placeholder 占位提示文字
outline:none 输入框的边框
input标签中的type属性值介绍:
select 下拉列表'选择列表'新的标签
option 选项textarea标签 多行文本输入框
02-搜索条案例
文本距离盒子有一定间距时优先考虑使用文字缩进text-indent,如果用内边距还要考虑盒子模型问题
文本输入框默认有边框和内边距
按钮也有默认边框
默认元素会以文字基线"文字底部"来进行元素对齐,用浮动可以解决让元素不以文字基线对齐,也可以解决元素之间默认间距问题
cursor:pointer 设置鼠标在元素上的样式为小手
03-块元素特点
块元素,也可以称为行元素,布局中常用的块标签如:div、p、ul、li、h1~h6等等都是块元素,它在布局中的行为特点:
1.独霸一行2.宽度默认和父元素一样宽 3.支持所有样式如margin padding等
04-块元素的样式重置
有些标签是包含默认的样式的:
p标签:含有默认外边距ul:含有默认外边距和内边距,以及条目符号 h1~h6标签:含有默认的外边距和字体大小 body标签:含有默认的外边距
实际开发中,为了便于布局我们会把带有默认样式的标签样式清除掉,这个做法就叫样式重置.
/* 清除标签默认的外边和内边距 */
body,p,h1,h2,h3,h4,h5,h6,ul{
margin:0px;
padding:0px;
}
/* 清除标签默认条目符号 */
ul{
list-style:none;
}
/* 将h标签的文字大小设置为默认大小 */
h1,h2,h3,h4,h5,h6{
/* 和父元素的字体一样大 默认16 */
font-size:100%;
/* 根据实际需求来加 */
font-weight:normal;
}
5-行内元素的特点
内联元素,也可以称为行内元素,布局中常用的标签如:a、span等等都是内联元素,它们在布局中的行为:
1.宽高默认和内容决定2.排列在一行,当遇到父元素的边界会自动换行 3.不支持宽高 margin上下 padding上下有问题 4.代码换行后行内元素之间有小间隙 5.行内元素设置文本水平对齐无效,但可以设置他们的父元素的text-align实现子元素水平对齐
06-行内元素的样式重置
其他内联元素"面试前最好看看它们的语义"
1、 标签 行内元素,表示语气中的强调词
2、 标签 行内元素,表示专业词汇
3、 标签 行内元素,表示文档中的关键字或者产品名
4、 标签 行内元素,表示非常重要的内容
包含默认样式的内联元素
a标签:含有的下划线以及文字颜色em、i标签:文字默认为斜体 b、strong标签:文字默认加粗 实际开发中,对这些标签进行样式重置。
/* 去掉a标签默认的下划线 */
a{
text-decoration:none;
}
/* 去掉标签默认的文字倾斜 */
em,i{
font-style:normal;
}
/* 去掉标签默认的文字加粗(按实际需求) */
b,strong{
font-weight:normal;
}
解决内联元素间隙的方法:
1、去掉内联元素之间的换行2、将内联元素的父级设置font-size为0,内联元素自身再设置具体的font-size
07-行内元素布局菜单案例
行内元素设置文本水平对齐无效,但可以设置他们的父元素的text-align实现子元素水平对齐
08-行内块元素的特性
内联块元素,也叫行内块元素,是新增的元素类型,现有元素没有归于此类别的,img和input元素的行为类似这种元素,但是也归类于内联元素,我们可以用display属性将块元素或者内联元素转化成这种元素。它们在布局中表现的行为:
1.元素排列一行2.宽度默认有内容决定 3.元素间有默认间距 4.支持宽高 marign padding等所有样式 5.子元素是内联块元素,父元素可以用text-align属性设置子元素水平对齐方式
display属性是用来设置元素的类型及隐藏的,属性的值有:
1、none 元素隐藏且不占位置2、block 元素以块元素显示 3、inline 元素以内联元素显示 4、inline-block 元素以内联块元素显示
09-行内块分页导航案例
把li和a都转换成inline-block为了动态性,可以确定子元素的尺寸,父元素的尺寸有子元素撑起来
10-浮动元素的特性
如果要实现子元素在父元素中水平居中时不能用浮动
元素浮动特点:
1.只有左和右浮动2.浮动元素遇到父元素或其他元素都会停下来 3.浮动后块元素也会排在一行,宽度会默认有内容决定,相邻元素一行排不下之后会自动换行 4.块元素和行内元素浮动后会自动转换为浮动特性的行内块元素
浮动可以解决的问题: 1.行内元素及行内块元素之间间距问题 2.垂直外边距不再合并 3.margin-top塌陷问题
11-清除浮动
什么时候需要清除浮动?
当父元素没有设置高度而子元素又全部浮动时,此时父元素的高度就无法通过子元素自动计算了,就要清除浮动来让父元素还能自动计算高度
清除浮动的方法
第一种:父级上增加属性overflow:hidden
第二种:在最后一个子元素的后面加一个空的div,给它样式属性 clear:both(不推荐)
第三种:使用成熟的清浮动样式类,clearfix
.clearfix:after,.clearfix:before{ content: "";display: table;}
.clearfix:after{ clear:both;}
.clearfix{zoom:1;} /* IE下清除浮动及解决margin-top塌陷问题 */
-定位
文档流
文档流,是指盒子按照html标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置。
我们可以使用CSS的position属性来设置元素的定位类型,postion的设置项如下:
1.relative 生成相对定位元素,元素所占据的文档流的位置保留,元素本身相对自身原位置进行偏移。
2.absolute 生成绝对定位元素,元素脱离文档流,不占据文档流的位置,可以理解为漂浮在文档流的上方,相对于上一个设置了定位的父级元素来进行定位,如果找不到,则相对于window元素进行定位。
3.fixed 生成固定定位元素,元素脱离文档流,不占据文档流的位置,可以理解为漂浮在文档流的上方,相对于浏览器窗口进行定位。
4.static 默认值,没有定位,元素出现在正常的文档流中,相当于取消定位属性或者不设置定位属性。
定位元素的偏移 定位的元素还需要用left、right、top或者bottom来设置相对于参照元素的偏移值。
定位元素层级 定位元素是浮动的正常的文档流之上的,可以用z-index属性来设置元素的层级
定位元素特性
绝对定位和固定定位的块元素和行内元素会自动转化为行内块元素
15-定位案例
/* 设置元素圆角,将元素四个角设置4px半径的圆角 */
border-radius:4px;
/* 设置元素透明度,将元素透明度设置为0.3,此属性需要加一个兼容IE的写法 */
opacity:0.3;
/* 兼容IE */
filter:alpha(opacity=30);
水平垂直居中提示框案例
/* 固定定位 */
position: fixed;
/* 水平居中 */
left: 50%;
margin-left: -150px;
/* 垂直居中 */
top:50%;
margin-top: -150px;
定位小结
static 默认值,没有定位
使用场景:一般来说不用写,除非想要覆盖之前设置的定位 relative 相对定位
使用场景:和absolute一起使用,常用于logo的定位。
absolute 绝对定位
使用场景:网页中的logo图片及一定移动动画
fixed 固定定位
使用场景:悬浮在浏览器中的广告窗口
标签:浮动,定位,行内,证书,python,标签,元素,默认,技术开发 来源: https://www.cnblogs.com/openeim/p/15110900.html