#学习总结
开学了进入小组学习前端的知识点
html 一个标准的html代码块如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title> <!--这个网页的标题 -->
</head>
<body>
<!--body中的所有内容都会在网页里面显示-->
</body>
</html>
html相当于网页中的骨架
三种样式设置
1，内联样式
2，将样式写到head中style标签中
3，导入css文件 为内容设定属性
```<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
<!--
<link rel="stylesheet" type"test/css" herf="./css/index.css" />
-->
p{
color:red;
font-size
} <!--`这是第二种样式-->
<title></title>
</head>
<body>
<p style="color：red">这是一段文字
</p> <!--这是第一种样式-->
<p class="three">这是第三种样式</p>
</body>
</html>
```css
.three{
color：red；
}
块和内联元素
块元素 例如 p h1 独占一行 内联元素 img a;会根据自身大小调整
a可以包含任意元素 p不可以包含其他块元素
选择器
<p>
这是一个p标签</p>
<div id="p1">
这是div标签
</div>
<div class="p2">
这是class的div标签
<div class="fu">
<div class="zi">
</div>
</div>
`#`p1{
color:red;
}
.p2{
color:red;
}
#p1,.p2{
background-color:white;
}
/*这是并集选择器 选择器1，选择器2*/
#p1.p2{
font-size:50px;
}
/*这是交集选择器 选择器1选择器2选择器3*/
*{
/*通配选择器*/
}
fu>zi{
\*/选中父元素当中指定子元素 父元素>子元素*/
伪类选择器
用来表示元素的一种特殊状态
<a herf="hhttp/123">这是一个超链接 </a>
```css
a:link{
color:red; */没有点击过的标签*/
}
a:visited{
*/点击过的标签只能设置颜色属性*/
}
a：hover{
color：bule；
} */鼠标移入状态*/
a:active{
color：red； */超链接点击时候的状态*/
}
子元素的伪类
<body>
<P>我是p标签</p>
<P>我是p标签</p>
<P>我是p标签</p>
</body>
p:first-child{
background-color:yellow;
}*/选中第一个子元素*/
p:last-child{
background-color:yellow;
}
*/选中最后一个子元素*/
p:nth-child{
background-color:yellow;
}
*/选中任意一个子元素 可以用来换颜色*/
p:nth-child(even){
}
*/偶数位置 odd是奇数位置*/
兄弟选择器
<body>
<p>p标签</p>
<span>span标签</span>
<p>p标签</p>
<p>p标签</p>
*/为span之后的设定颜色 只能设置一个*/
span+p{
}
*/为span之后的设定颜色 只能设置全部*/
span~p{
}
否定伪类
<p>p标签</p>
<p class=“hello”>p标签</p>
<p>p标签</p>
p：not(.hello){
background-color:red
}
选择器的优先级
内联样式 id 类和伪类 元素选择器 通配 继承样式
列表
无序列表
<ul="disc">
<li> </li>
</ul>
<!--可以通过type属性修改符号样式-->
<!--可以通过在css中写style去掉符号-->
<!--有序列表可以ul改为ol-->
盒子模型
一个块元素相当于一个盒子 可以用来布局
margin 外边距
padding内边距
块元素 行内元素 行内块元素
<div class="box1"> </div>
<div class="box2"`> </div>
<!--块元素默认纵向排列但是可以给他设置成行内元素或者行内块元素-->
.box1{
display:inline
}
*/变成内联元素* block 块元素 inline-block行内块元素/
相对定位
css中的position 相对定位不会脱离文档流 不会改变元素性质 相对于自己作为起点
绝对定位
绝对定位会相对于开了定位祖先元素的定位
所以可以子绝父亲
会脱离文档流 会改变性质 内联元素会变成块元素
生活总结
考核写的是页面 完成度一般般 还是觉得需要多练 多问问学长学姐 马上要分端了也希望自己做的决定是正确的 很忙但是也很宠兽 下周继续加油吧
下周计划
继续学习前端内容 还有这周没来得及学习的动画
扫一扫
1316
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
