css框架学习

css重新学习

1.css的语法自行百度没什么可以说的。

2.css的选择器

（1）类选择器 ：class用法是，.h1{color:red}

（2）id选择器 ：id用法是，#h1{height:300px}

（3）符合选择器 : 用法是 .h1 img{height:400px; width:300px}

3.css的样式：

背景，文本，字体，链接，表格

背景：background-color

文本：有一些不是常用的就不写了

text-indent：1cm ；文本缩进1cm

text-align :left,right,center;

字体：font-size

链接：

a:link - 普通的、未被访问的链接

a:visited - 用户已访问的链接

a:hover - 鼠标指针位于链接的上方

a:active - 链接被点击的时刻

表格：

css部分代码实现表格的

table,td,th{

            border: 1px solid black;

        }

        table{

            width: 100%;

        }

        th{

            width: 50px;

        }

html代码实现页面的内容的。

<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Bill</td>
<td>Gates</td>
</tr>
<tr>
<td>Steven</td>
<td>Jobs</td>
</tr>
</table>

4.盒子模型主要涉及到有margin，padding，border3个大块组成。

margin：主要是负责外边距的

 margin-top: 30px;    //上边距30px

 margin-left: 30px;  //左边距30px

 margin-right: 30px;   //右边距30px

 margin-bottom: 30px;   //下边距30px

padding：负责内边距的，与外边距不同，padding不是只能完全透明的，可以设置背景颜色和图片

 padding-left: 10px;

 padding-top: 10px;

 padding-right: 10px;

 padding-bottom: 10px;

border：最基本的，border像margin和padding一样可以分别对每一条边进行设置，也可以使用简写属性border进行设置。

border-top：上边界

border-bottom：下边界

border-left：左边界

border-right：右边界

如果想学习的更深入一些的推荐别的博主写的博客，本人主要是1.做一些笔记没事的时候抽空看看2.分享一下自己的学习思路和想法。3.基本上这些东西

他们都是有一个框架的我也把一些常用的工作中常用css和html的一些元素写了进来，纯给小白学习前段看的，也是基础的知识模块。

最后补充下还没有写完的知识点：

在css中还有一个是定位的问题：

absolute：生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。

fixed：生成绝对定位的元素，相对于浏览器窗口进行定位，这个是固定定位方式。

relative：生成相对定位的元素，相对于其正常位置进行定位。

浮动的问题:基本就是在下面那几个属性其余的按照需求来吧

float：left、right、none