11.21css学习-下午

今夜无风      2022-02-10     385

关键词:

CSS框模型,看似一个盒子,封装周围的HTML元素,包括:边距、边框、填充和实际内容
Margin:清除边框区域,没有背景色,完全透明
Border:边框周围的填充和内容,边框是受到盒子的背景色影响
Padding:清除内容周围的区域,会受到框中填充的背景颜色影响
Content:盒子的内容,显示文本和图像
指定一个CSS元素的宽度和高度属性时,你只是设置内容区域的宽度和高度,要知道,完全大小的元素,你还必须添加填充,边框和边距。
div.ex{
width: 220px;
padding: 10px;
border: 5px solid gray;
margin: 5px;
}

总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距
总元素的高度=高度+顶部填充+底部填充+上边框+下边框+上边距+下边距


边框属性:允许指定一个元素边框的样式和颜色
border-style边框样式:指定显示什么样的边界
dotted:点线边框
dashed:虚线框
solid:实线框
double:定义两个边界框
groove:3D沟槽边界
ride:3D脊边界
inset:3D嵌入边框
outset:3D突出边框

border-width边框宽度
指定宽度的两种方法:1)指定值,如1px、1em;2)使用3个关键字之一,thin,medium,thick

border-color边框颜色

单独设置边框:指定不同的侧面不同的边框
border-top-style: groove;
border-right-style: solid;
border-bottom-style: groove;
border-left-style: solid;

也可以一次设置单一属性:border-style:dotted solid double dashed;
border-style有四个值,分别表示上、右、下、左四个位置

outline:用于绘制元素周围的一条线,位于边框边缘的外围

分组和嵌套
样式表中有很多具有相同样式的元素,可以将这些分配到一个组里面。使用分组选择器,每个选择器用逗号分开。
h1,h2,p
{
color:green;
}

嵌套选择器:选择器内部的选择器样式
在下面的例子,为所有p元素指定一个样式,为所有元素指定一个class="marked"的样式,并仅用于class="标记",类内的p元素指定第三个样式
p
{
color:blue;
text-align:center;
}
.marked
{
background-color:red;
}
.marked p
{
color:white;
}


CSS显示(display)与可见性(visibility)
visibility属性指定一个元素可见或隐藏,但是仍然会影响格局
{visibility: hidden}
display:没有隐藏的元素,不会占用任何空间
{display: none}

Positioning定位:为一个元素定位,要首先设定position的属性,有四种不同的定位方法
Static定位:HTML的默认定位,即没有定位,元素出现正常流中,不会受到top,bottom,left,right影响
Fixed定位:元素的位置相对于浏览器窗口是固定的位置,窗口的滚动他也不会移动
p.pos_fixed
{
position:fixed;
top:30px;
right:5px;
}

Relative定位:相对定位元素的定位是相对其正常位置
h2.pos_left
{
position:relative;
left:-20px;
}
h2.pos_right
{
position:relative;
left:20px;
}

Absolute定位:绝对定位的元素的位置相对于最近的已定位父元素,如果没有已定位的父元素,则它的位置相对于<html>
h2
{
position:absolute;
left:100px;
top:150px;
}

















































































11.21团队总结

...我们还总结了这几天以来所遇到的艰难困苦,还需要努力学习,也从中感受到了团队协作的乐趣,这几天过得很充实,也学习到了很多。 查看详情

11.21

1.今日初步学习了文件的导入、编写了excel文件的四等水准测量记录表,并进行了导入调试2.明天进行初步的四等水准计算代码的编写3.昨天解决了页面隐藏的问题,也出现了listview显示为列不为行的问题,百度无果,改用了treeview... 查看详情

图学习笔记(11.21)(代码片段)

最近数据结构和离散数学都学习了有关图的知识,自己学习算法也对图有了更加深入的了解,下面做一下汇总,便于复习翻看。(思路是自己理解写的,代码非原创)图一、图的概念二、图的存储1.邻接矩阵2.邻接表3... 查看详情

11.15-11.21大学生python学习社区总结+优秀社区成员点名表扬&&技术书籍和csdn定制背包奖励~

... 欢迎每一位小伙伴的加入:社区:大学生Python学习 文章目录:11.15-11.21的社区总结:优秀群成员点名表扬&&技术书籍和CSDN定制背包奖励:排名第一位:[Xt_Yj](https://blog.csdn.net/xt_yj)排名第二位:... 查看详情

11.15-11.21大学生python学习社区总结+优秀社区成员点名表扬&&技术书籍和csdn定制背包奖励~

... 欢迎每一位小伙伴的加入:社区:大学生Python学习 文章目录:11.15-11.21的社区总结:优秀群成员点名表扬&&技术书籍和CSDN定制背包奖励:排名第一位:[Xt_Yj](https://blog.csdn.net/xt_yj)排名第二位:... 查看详情

11.21

今天我们组完成了制作软件的工作,顺利地进行了软件编写的收尾工作,这个软件已经能很好地运行了。遇到的困难是在出现错误后,已存金额会置零,不能保存之前的金额。但是我们之后解决了这个困难。 查看详情

2017.3.31下午学习报告

学习了宪法部分,并复习了上午学习的词汇 查看详情

2017.5.17下午学习内容

查看详情

2017.4.25下午学习内容

学习了英语语法和词汇,并复习了作文部分 查看详情

6月1日下午学习日志

下午写了一套四级真题并纠错改正总结。 查看详情

2017.6,2下午学习内容

听刑法课程 查看详情

11.21

 登录功能完成:js:设置returnhtml:设置forminputpy:@app.route设置methodsGETPOST读取表单数据查询数据库用户名密码对:记住用户名跳转到首页用户名密码不对:提示相应错误。session:从`flask`中导入`session`设置`SECRET_KEY`操作字典一样... 查看详情

2017.5.23下午学习内容

听刑法章节课程 查看详情

2017.5.24下午学习内容

听专业课课程 查看详情

2017.4.7下午学习内容

背诵了上午所学单词和学习了新课单词,并听了宪法章节 查看详情

2017.3.30下午学习报告

复习了考研课程第四,五单元 查看详情

2017.4.10下午学习内容

听作文课,并复习了词汇 查看详情

2017.5.22下午学习内容

看考试分析和做英语阅读 查看详情