小小的总结一下CSS的一点基础知识

上学期在老师的带领下学习了CSS,这学期自己看书,再重新复习,学习(上学期自己没有学习到的东西),并把自己新接触的做一个笔记。就像业界大牛说的那样CSS语言不像编程语言,毫无逻辑可言,觉得相对于编程来说,CSS写出来的是一个直观的可视化的感性的这种。设计师就像是一个“手艺人”创造出一个富有表现力,生命力的“艺术品”。

新发现了一个属性:@font-face规则在CSS3规范中属于字体模块,该规则的推出对于网页设计来说是一个革命性的进步。在传统设计中,设计师不敢使用各种艺术字体类型,甚至是常规字体也需要慎重使用。因为设计师必须考虑每位浏览者的系统中是否安装了所有字体。有了@font-face规则,这个顾虑就可以放下了:只要在互联网上指定一种字体类型源,而不管用户电脑是否安装该字体,设计的网页都能够正确显示。配合字体的使用可以使我们的字体显示为图标。

对CSS基础的一个整理

1.基本标签

<p></p>
 <span></span>
 <h1></h1> (ps:h1-h6)

<dl></dl>
  <ul></ul>
  <form></form>
  <a></a>

2.盒模型

盒尺寸的四个盒子:content box、padding box 、border box、和margin box、

盒模型是我们搭建框架的一个依据,我们根据盒模型对网页进行排版,决定每一块放在哪个位子。主要有margin 、padding 、border 三部分组成。

3.元素的分类

我们把所有的元素归成三类:块级元素、行内元素。

块级元素生成一个元素框,它会填充其父元素的内容区,旁边不能有其他元素。列表项是块级元素的一个特例。除了表现方式和其他元素一致,列表项还会生成一个标记符——无序列表通常是一个圆点,有序列表中则是一个数字——这个标记符会“关联”到元素框。

行内元素在一个文本行内生成元素框,而不会打断这行文本。

display属性的三个值:block、inline、list-item

4.浮动和定位

float(浮动)值:left、right、none、inherit(继承)

position(定位):值:static、relative、absolute、fixed、inherit (初始值是static)

以上是我的一个总结,我觉得最难的应该就是兼容问题和自适应问题。在实际应用中,因为电脑的尺寸不同,分辨率的问题会造成我么制作的页面偏离我们的设计效果,不同的浏览器有自己默认的“样式"和”与生俱来"的属性。

猜你喜欢

转载自www.cnblogs.com/halilulu/p/9096434.html
今日推荐