ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

2021-1-26~~2021-2-5本周学习内容

2021-02-06 14:01:33  阅读:164  来源: 互联网

标签:定位 26 标签 元素 本周 选中 2021 选择器 CSS


                       本周学习内容

一、CSS选择器 二、git安装使用 三、定位属性 四、博文尚美案例
1、 CSS选择器:标签名选择器;标签选择器位于文档窗口下的状态栏最左边,div{color:red};就是标签选择器 ,标签选择器的作用:快速选择网页中的元素。
在这里插入图片描述

类选择器:若要为相同的标签赋予不同的CSS样式就应使用类选择器.header{ };.header .logo{ };.header .nav{}在这里插入图片描述

ID选择器:
(如:id=“name”,id=“name_txt”)ID选择器和类选择器相似,不同的是,ID选择器不能复用。在一个XHTML文档中,一个ID选择器只能把其CSS样式指定给一个标签。
后代选择器:1、后代选择器和子元素标签都可以使用标签名称/id名称/类名称等作为选择器,2、后代选择器和子元素标签都可以使用标签名称/id名称/类名称等作为选择器
子选择器:
1.连接符号:空格作为连接符号;“>” 作为连接符号
2.选中标签范围:后代选择器会选中指定标签中,所有的特定后代标签,也就是会选中儿子,孙子,只有放到标签中的特定标签都能选中;子元素选择器只会选中指定标签中,所有特定的直接标签,也就是只会选中特定的儿子标签
在这里插入图片描述

2、 Git的安装和使用,sourcetree的安装,码云的上传更改和克隆运用学习。
3、 研究定位属性,position属性值有relative、absolute、fixed、sticky、static。
1、absolute:生成绝对定位的元素,相对于 static 定位以外的第一bai个父元素进行定位。
在这里插入图片描述

2、fixed:生成绝对定位的元素,相对于浏览器窗口进行定位。(元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。)
3、relative:生成相对定位的元素,相对于其正常位置进行定位。
在这里插入图片描述

4、static:默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
5、sticky:盒位置根据正常流计算,然后相对于该元素在流中的 flow root(BFC)和 containing block(最近的块级祖先元素)定位。在所有情况下(即便被定位元素为table 时),该元素定位均不对后续元素造成影响
5、独立完成博文尚美案例,小组完成博文尚美案例
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

标签:定位,26,标签,元素,本周,选中,2021,选择器,CSS
来源: https://blog.csdn.net/weixin_54729098/article/details/113723491

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有