近期在学习牛腩的时候遇到了网页的制作。挺新奇的。其中涉及到了有关CSS的知识,于是乎自己也就花费两个小时的时间。找了本浅显易懂的书来看了一遍,从宏观上来了解CSS的相关内容。有关CSS的基础知识详见下链接。

CSS基础知识

下面是对CSS理解的导图

通过上图我们也发现。CSS也非常难。也easy。easy是说。学起来非常快就能够上手,这中语言简单易懂,仅仅要你具备小学英语的知识量就能够了。

困难是在指学好它并不easy,由于它须要你耐心。就好比我们对word文档的排版。哪里须要主体鲜明一点。哪里须要着重突出一下,哪里须要加一下背景图片,这都须要考虑的。事实上就是美工的工作。学习CSS也非常杂,为何会这么说呢。由于须要与PS、photoshop联系起来。

下面是一些常见的属性设置

文字样式

    line-height:行间距

    letter-spacing:字间距

    text-decoration:标题处keyword的下划线

    font-style:设置字体风格

    font-weight:字体粗细

    border-style:边框样式

    border-width:边框粗细

    vertical-align:图片相对于文字对齐方式

背景图片

    background-image:加入背景图片

    background-repeat:背景图片的反复方式

    background-position:背景图片的位置

    background-attachment:固定背景图片

CSS设置表格与表单的样式

    border-collapse:边框重叠

    list-style-type:用来清除列表前面的标记

设置页面和浏览器的元素

    <a href=""></a>:加入超链接

    a:link:超链接的普通样式

    a:visited:被点击过的超链接的样式

    a:hover:鼠标经过超链接上的样式

    a:active:在超链接上单击时

    cursor:设置鼠标的显示样式

用CSS制作有用的菜单

    <ul></ul>:有用列表

    list-style-type:项目列表的标头

    list-type-image:项目列表能够设置为图片

    display:block :块级显示

看看这些属性是不是so easy呢? 仅仅要稍微的熟悉一下。你就能够称的上是半个CSS专家了。

从导图中我们也可以看到,假设可以把CSS布局学懂的话。就算成功一半多了,所下面篇博客将会讲CSS中的盒子模型

CSS初步理解的更多相关文章

  1. javascript 原型及原型链的初步理解

    最近折腾了好久,终于是把js里面的原型和原型链做了个初步的理解: 在这里,我打个比喻: 我(child),我妈constructor(构造函数)生了我:别人问我老妈跟谁生的我,于是此时我妈会指向我爸爸 ...

  2. Spring学习笔记--环境搭建和初步理解IOC

    Spring框架是一个轻量级的框架,不依赖容器就能够运行,像重量级的框架EJB框架就必须运行在JBoss等支持EJB的容器中,核心思想是IOC,AOP,Spring能够协同Struts,hiberna ...

  3. Graph Cuts初步理解

    一些知识点的初步理解_8(Graph Cuts,ing...) Graph cuts是一种十分有用和流行的能量优化算法,在计算机视觉领域普遍应用于前背景分割(Image segmentation).立 ...

  4. CSS深入理解之overflow

    CSS深入理解之overflow 前言 这是跟着张鑫旭重学CSS的overflow篇 基本属性 overflow有以下五个基本属性: 1.visible : 默认值,具体表现为,应用此属性后,子元素超 ...

  5. CSS深入理解之line-height

    以下文字整理自慕课网——张鑫旭的<CSS深入理解之line-height>. line-height,又称行高,指的是两行文字基线之间的距离,又可以称为这行文字所占的高度. 定义三问: 什 ...

  6. CSS深入理解学习笔记之absolute

    1.absolute和float 拥有相同的特性表现: ①包裹性(容器应用之后,可以包裹里面的内容): <!doctype html> <html> <head> ...

  7. 非常易于理解‘类'与'对象’ 间 属性 引用关系,暨《Python 中的引用和类属性的初步理解》读后感

    关键字:名称,名称空间,引用,指针,指针类型的指针(即指向指针的指针) 我读完后的理解总结: 1. 我们知道,python中的变量的赋值操作,变量其实就是一个名称name,赋值就是将name引用到一个 ...

  8. springBoot(1)---springboot初步理解

    springboot初步理解 在没有用SpringBoot之前,我们用spring和springMVC框架,但是你要做很多比如: (1)配置web.xml,加载spring和spring mvc 2) ...

  9. Mysql加锁过程详解(7)-初步理解MySQL的gap锁

    Mysql加锁过程详解(1)-基本知识 Mysql加锁过程详解(2)-关于mysql 幻读理解 Mysql加锁过程详解(3)-关于mysql 幻读理解 Mysql加锁过程详解(4)-select fo ...

随机推荐

  1. Meson使用

    安装 Meson是基于python3实现,至少需要python3.5才能运行,默认采用ninja作为后端.在Ubuntu下最简单的是通过pip3安装 $ sudo apt-get install py ...

  2. getElementsByName使用

    查了下手册,getElementsByName()不能提取没有name属性的标签.div标签本身没有name属性,所以不能被提取.有name标签的主要是各种input标签,所以默认情况下getElem ...

  3. Gitlab 维护措施

    Gitlab 升级: https://jingyan.baidu.com/article/72ee561ab1b333e16038df63.html Gitlab Rpm包地址: https://pa ...

  4. html行级元素和块级元素以及css转换

    之前有说过html的标签是有语义的,当然也就有一些默认的样式,比如标题有h1···h6,他们的字体由大至小一次递减,字体比一般字体要加粗. 这样也就有了行级元素和块级元素,下面来看看什么是行级元素什么 ...

  5. Spark Streaming 整合 Kafka

    一:通过设置检查点,实现单词计数的累加功能 object StatefulKafkaWCnt { /** * 第一个参数:聚合的key,就是单词 * 第二个参数:当前批次产生批次该单词在每一个分区出现 ...

  6. 软件开发的MVC构架

    MVC:IDE开发环境开发时,无意中使用的软件结构. 转自于wikipedia:http://zh.wikipedia.org/wiki/MVC 软件的层次划分:框架--组件(设计模式)--算法与数据 ...

  7. 杭电2061WA 01

    #include<stdio.h> struct mem { char s[50]; double c; double f; }; int main() { struct mem x[60 ...

  8. (转) RabbitMQ学习之spring整合发送同步消息(注解实现)

    http://blog.csdn.net/zhu_tianwei/article/details/40918477 上一篇文章通过xml配置rabbitmq的rabbitTemplate,本节将使用注 ...

  9. sql语句参数化问题

    select  @PageSize * from tets SELECT 在WHERE 之前都不能参数化. TOP 只能做字符串运行.

  10. 认识图片放大工具PhotoZoom的菜单栏

    使用PhotoZoom能够对数码图片无损放大,备受设计师和业内人员的青睐,它的出现时一场技术的革新,新颖的技术,简单的界面,优化的算法,使得它可以对图片进行放大而没有锯齿,不会失真.本文为您一起来认识 ...