• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >CSS > CSS 基础教程 在网页中使用CSS

CSS 基础教程 在网页中使用CSS

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含网页,CSS等相关知识,佚名 希望在学习及工作中可以帮助到您

本教程系个人抽工作之余所作,按照我个人的想法我是想将一些基本的东西以较为轻松的语言描述出来,做成一个系列教程(这需要时间,我会努力抽空更新的),争取让每一个看这个东东的人都能有所收获,但是因作者本人水平有限,不妥当之处敬请留言批评指正。

本教程假设您没有任何CSS样式表语言的基础,甚至,您可以完全不知道CSS是什么东东,但是,我们同样假设您已经掌握了基本的HTML/XHTML语法。比如,您肯定知道<head></head>是表明页面的头部,<p></p>是表示页面的一个段落。

 

------------------------------------------------------分割线----------------------------------------------------------

 

1、正式开始学习之前的几句啰嗦话:

l        CSS不是什么高深的东东,它的编写环境也很简单,你只需要在WINDOWS自带的记事本中编写,然后在浏览器中查看效果就可以了,不要认为你是在编程,实际上css唯一的作用是用来控制网页中各种对象的表现形式而已,so…你要有充足的信心相信你一定可以学好。

l         虽然CSS学习起来并不困难,但是它也讲究一个动手能力和实际操作经验。我认为所有讲究动手能力和实际操作经验的知识学习起来最好的方法就是动手去实践,所以,我们为什么不实际练习一下呢?记住一点:看100页书,不如动手写10行代码。

2、本小结您将学习的内容:

l         CSS到底是什么东东,它有何作用?

l         在网页中加入CSS的方法。

-------------------------------------------------华丽的分割线------------------------------------------------------

第一个问题:CSS到底是什么东东,有何作用?

        在解决这个问题之前,我们先来看看网站中一个页面的基本组成:通常,一个页面(前台)由一下三个部分组成:结构,表现和行为。

 

注:

结构:通常指结构化的文本,通俗点理解就是经过结构化了的页面内容。用于结构化WEB标准技术有HTML、XHTML、XML等。

 

表现:指将页面中的元素用什么样的外观展示出来,比如文字的字体,字号,颜色,大小,是否有下划线,页面的背景颜色(图片),段落的对齐方式,元素在页面的摆放位置等等。通常用于表现的标准技术就是我们这个教程要讲的CSS(层叠样式表)技术。

 

行为:通俗理解为人(用户)与网页的交互,比如:我在页面的某个元素上单击一下鼠标,页面会给我什么反应——这就是一个简单的人与网页的交互,我们也可以大体理解为人与机器的交互,交流,沟通(这几个词可能不太准确,请原谅偶在汉语辞藻方面的贫乏)。目前主要表现行为的技术是各种所谓的脚本技术,比如:javascript(当前那是相当流行啊)。


  有了上面的知识铺垫,我们知道了CSS是用来控制页面表现的,也就是说是用来控制网页最终展示出来的外观的。CSS的英文全称是Cascading Style Sheets,翻

您可能想查找下面的文章:

  • 在网页标题栏上和收藏夹显示网站logo的实现方法
  • 学习DIV+CSS网页布局之一列布局
  • 网页切图的CSS和布局经验与要点
  • 响应式网页设计的快速教程(适合个人站点)
  • css3使网页、图片变成灰色兼容大多数浏览器
  • 任意一块网页内容实现“活”的背景(目前火狐浏览器专有)
  • css网站布局实录学习笔记第三部分网页布局与定位
  • 常用的网页布局方法单侧固定另一侧适应充满
  • 网页布局之响应式设计简明指南
  • css制作网页中的虚线(border属性的使用方法)

相关文章

  • 2017-08-06CSS教程 CSS定位属性
  • 2017-08-06CSS3中几个新增加的盒模型属性使用教程
  • 2017-08-06浅析CSS等高布局的6种方式
  • 2017-08-06css 块状元素和内联元素
  • 2017-08-06html+css实现数据图表的展示效果
  • 2017-08-06div+css打造可变高宽的圆角框
  • 2017-08-06分享一个2014年圣诞节倒计时页面特效
  • 2017-08-06CSS定义Radio单选项和Checkbox复选框样式有效代码
  • 2017-09-04自定义input[type=”file”]的样式
  • 2017-08-06CSS Sprite优化 减少HTTP链接数

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • css实现的交互小三角箭头图标
    • 详解CSS中的伪类与伪元素及二者间的区别
    • CSS 字体单位em简介
    • Google 谷歌内页logo的呈现方式(图片下面有文字)
    • 结合CSS3的新特性来总结垂直居中的实现方法
    • css中padding和margin的异同点介绍
    • css3media响应式布局实例
    • 最常用和实用的CSS技巧
    • css grid 布局
    • 通过css旋转字体示例代码

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有