一、概念

级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行网页风格设计的。实现网页内容和样式的分离。

二、CSS核心

选择器、标准流、盒子模型、浮动、定位、块级模块、行级模块

1、选择器。

要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。

HTML页面中的元素就是通过CSS选择器进行控制的。

1)类别选择器

表示形式:

在HTML中,元素可以定义一个class的属性。

  如:

  <div class="ladygaga">

在CSS中:

前面以”.”来标志,如:

  .ladygaga

{

color:#000;

}

2)ID选择器

表示形式:

在HTML中: <div id=" ladygaga">

在CSS中:

# ladygaga

{

color:#000;

}

3)HTML标签选择器

表示形式:

HTML中:<p>ladygaga</p>

CSS中:p{

color:#000;

}

4)其他的选择器:后代选择器、子选择器、伪类选择器、通用选择器、群组选择器、相邻同胞选择器、属性选择器。

前三个选择器的优先级为:ID选择器>类选择器>HTML标签选择器。

2.盒子模型

CSS中的盒子模型通过图来解释吧

上图就是一个标准的盒子模型。也是一个金典的模型,它把网页中的每一个元素当作一个盒子,用这个模型来编辑这个元素在网页所在的位置。盒子模型中可以设置元素的content内容(长、宽),外边距margin(上、下、左、右),内边距border(上、下、左、右),盒子框的(宽度)。

3.浮动。

浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。

由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。

浮动用的时候要注意因为浮动会影响到标准流的元素导致标准元素显示异常。

4.定位

定位有相对定位和绝对定位,这个牛腩中好像没用到。

5.块级模块和行级模块。

块级模块用<div></div>表示

行级模块为<span></span>表示

一般网页都用块级模块,因为这个用起来比较灵活

转载于:https://www.cnblogs.com/iplus/archive/2012/11/26/4490460.html

牛腩新闻发布系统——初探CSS相关推荐

  1. 牛腩新闻发布系统——后台前台整合技术

    在牛腩新闻发布系统中用到了一些技术我就来总结下 一.鼠标超链接设置 一开始就用到了鼠标超链接的设置.尾部样式的设置,这个东西每个网站都要用到非常长用所以可以写下来积累积累. 举个例子 如图:鼠标没有移 ...

  2. 牛腩新闻发布系统——制作母板页

    以牛腩新闻发布系统为例,复述Web开发母版页制作: 单击右键--新建项--选择母版页.命名--确定. 这个母版页中包含三部分不变的内容:top(图片).Search(搜索).footer(底部版权) ...

  3. 【牛腩新闻发布系统】开发前的准备01

    前言: 牛腩新闻发布系统已经完成了很久了,在完成的过程中,一步步按照视频的步骤在走,中间探索了一下注释部分是怎么出来的.整个学习过程紧凑而且有序,中间也拖沓了两周有开始接着完成,接下来是整个过程中一些 ...

  4. 牛腩新闻发布系统——触发器使用

    触发器(trigger)是个特殊的存储过程,它的执行不是由程序调用,也不是手工启动,而是由事件来触发,比如当对一个表进行操作( insert,delete, update)时就会激活它执行.触发器经常 ...

  5. 【牛腩新闻发布系统之handler】

    前言: 敲着牛腩已经有很长时间了,一路走来,没有顺顺利利的!正是因为这样,我才感觉自己有了收获!也正是错误的调试,对牛腩新闻发布系统更加了解了!毕竟,错误的调试是一个经历并成长的过程,今天,主要来总结 ...

  6. 【Dongle】【Web】牛腩新闻发布系统之中篇

    相对于前篇总结来说,中篇来得晚了很多,大概都一个多月过去了由于牛腩视频已经看完,并跟着敲了下来,故而在这里,我就总结一下视频后40讲的大概知识点. 在前期框架搭建好之后,中期也就是针对每个页面设计符合 ...

  7. 牛腩新闻发布系统—如何发布

    [前言] 牛腩项目的学习已经接近尾声了,到了该发布的时候了,当时看完牛腩老师的发布系统,并没有很懂,就想着先往下走,当看了Asp.Net第一集的时候,就突然明白怎么回事了,其实也没有那么难. [内容] ...

  8. 牛腩新闻发布系统--阶段总结(一)

    牛腩视频看了有20集了,通过对这部分的学习,让自己对开发一个系统的过程有了一定的了解.虽然之前已经写过好几遍的开发文档,但是这次的真正实践给了自己更加深刻的印象. 我对前17讲的总结如下图: 视频开篇 ...

  9. 【牛腩新闻发布系统】系统发布06

    前言: BS系统的发布可以通过VS自带的工具实现,也可以通过windows系统自带的IIS进行发布,我用的第二种方法发布的. 使用的方法: https://blog.csdn.net/j1553341 ...

最新文章

  1. Python【每日一问】36
  2. ThinkPHP 目录结构
  3. android 之intent(意图)详解
  4. 从概设流程、审美、设计思路几个方面,漫谈游戏美术设计的思维方式
  5. js array 的理解
  6. python3.7怎么使用arcpy_从Python到空间分析Arcpy|1.3.7 神啊!救救我之如何处理报错...
  7. java启动密码,java - 用户验证密码后如何启动java applet程序? - SO中文参考 - www.soinside.com...
  8. 「技术人生」第6篇:技术同学应该如何理解业务?
  9. axure日期选择器组件_vue干货分享,超过六种组件通信方法讲解和精髓归纳
  10. Chrome/360极速/猎豹/枫树/浏览器去除视频网站广告利器插件——【切糕】广告视频屏蔽专家下载...
  11. hadoop-0.20.2完全分布式集群
  12. 一种提升语音识别准确率的方法与流程
  13. PHP两个匿名函数传递性,PHP让人不知道的匿名函数的几种写法(附代码)
  14. cad多个窗口并排显示_高版本CAD如何显示阵列窗口?
  15. JAVA编写猜拳游戏
  16. 老式计算机如何设置u盘启动,新旧主板BIOS设置U盘启动详细分析
  17. 浙江省中职院校春季技能竞赛中职计算机项目数字影视后期制作技术...,数字影视后期制作竞赛试卷.doc...
  18. Python24中使用urllib时遇到IOError的正确打开方式
  19. 新手如何在IEEE上发表论文?
  20. 【算法-LeetCode】121. 买卖股票的最佳时机(动态规划;贪心)

热门文章

  1. [NOTE] DSVW靶场练习笔记
  2. TypeError: 'builtin_function_or_method' object has no attribute '__getitem__'的解决方法等
  3. [转] CMake入门
  4. [BUUCTF-pwn]——ciscn_2019_s_3
  5. java注销对话框_【java小程序实战】小程序注销功能实现
  6. velocity显示List与Map的方法详细解析
  7. Java更新XML的四种常用方法简介
  8. spring autoproxy by annotation
  9. 使用Spring JDBC进行数据访问 (JdbcTemplate/NamedParameterJdbcTemplate/SimpleJdbcTemplate/SimpleJdbcCall/Stor)
  10. Index of XML