Css是什么

CSS即层叠样式表（Cascading StyleSheet）。 在网页制作时采用层叠样式表技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。 只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。CSS3是CSS技术的升级版本，CSS3语言开发是朝着模块化发展的。以前的规范作为一个模块实在是太庞大而且比较复杂，所以，把它分解为一些小的模块，更多新的模块也被加入进来。这些模块包括： 盒子模型、列表模块、超链接方式 、语言模块 、背景和边框 、文字特效 、多栏布局等  From baidu

当前文章主要描述css 样式的一些基本的，最新版本的大家可自行抛砖引玉。

让我来看下面Html代码 来简单了解下css

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

        <style type="text/css">

        </style>

        <script type="text/javascript">

        </script>

    </head>

    <body style="background-color: yellow">

    <div style="width: 400px; height: 200px; border: 1px solid red;">

    这是一个div 元素，显式的区域，使用的是行内样式

    </div>

    </body>

</html>

执行效果如图:

可以看到 整个页面 背景色为黄色，div 块 呈现了 红色边框

不难看出，样式都是以 style="" 嵌套在 html 标记之中的。

CSS属性大全

点击此处查看

使用方法，都是以 style="" 嵌套在 标记之中,   属性名:属性值，多个属性之间以;分号来 分割。

例如：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

        <style type="text/css">

        </style>

        <script type="text/javascript">

        </script>

    </head>

    <body style="background-color: yellow">

    <div style="width: 400px; height: 200px; border: 1px solid red;font-size: 23px; color: blue; text-indent: 2em;">

    这是一个div 元素，显式的区域，使用的是行内样式

    </div>

    <p style="border:10px dotted red;">测试文本信息 </p>

    </body>

</html>

结果如图:

好了，这篇文章就描述了基本的 css 的一些基础的 字体  边框  背景 样式属性，感兴趣的可以去试试其它相关属性，便于对这些属性有一个基本的认识与了解。

下篇文章将会描述css 选择器， css 作用优先级 ，以及css 一些基本的命名规范。

Html 之div+css布局之css基础的更多相关文章

  1. Html 之div+css布局之css选择器

    CSS选择器 什么叫选择器?通俗的来说就是 我想改变html 中某个地方的  字体大小 或者背景色 或者其它属性 内边距 外边距,宽度高度 等等 一些Css 样式. 那么我们如何找到对应的 元素呢? ...

  2. CSS布局口诀 - CSS BUG顺口溜

    在进行CSS网页布局时遇到BUG,请认真阅读以下内容,非常容易记忆的,不知道哪位高人把CSS BUG编成了顺口溜了!看看好不好记住呢? 一.IE边框若显若无,须注意,定是高度设置已忘记: 二.浮动产生 ...

  3. css布局基础总结

    前端css布局知识繁杂,实现方式多种多样.想写出高效.合理的布局,必须以深厚的css基础为前提.为了方便记忆和复习,将css布局要点记录如下.内容较多,应用方面说的不太详细,但都是很实用的点. 所谓布 ...

  4. Python之路-python(css布局、JavaScript)

    CSS布局 JavaScript css布局: 后台管理界面一:(左右标签都有下来菜单) 利用position: absolute;让某个标签固定在具体位置,然后使用overflow: auto;属性 ...

  5. CSS 布局 - Overflow

    CSS 布局 - Overflow CSS overflow 属性用于控制内容溢出元素框时显示的方式. 这里的文本内容是可以滚动的,滚动条方向是垂直方向.dd马达价格 这里的文本内容是可以滚动的,滚动 ...

  6. 详解CSS布局

    CSS页面布局允许我们拾取网页中的元素,并且控制它们相对正常布局流.周边元素.父容器或者主视口/窗口的位置.主要对文档流的改变进行布局.假设你已经掌握了CSS的选择器.属性和值,并且可能对布局有一定了 ...

  7. css布局&初始化&基准样式

    学习css布局比较好的网站 学习css布局 1.css设置模块 typography(字体) colour(颜色) link(链接) forms(表单) layout(布局) navigation(导 ...

  8. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  9. CSS布局基础

    (初级)css布局 一.单列布局1.基础知识块级元素 div p ul li dl dt 行级元素 img span input strong同一行显示.无换行2.盒子模型盒子模型 (边框border ...

随机推荐

  1. php知识分享

                                                                      PHP 获取ip地址代码汇总                     ...

  2. 删除ORACLE的步骤

    1.关闭oracle所有的服务.可以在windows的服务管理器中关闭: 2.打开注册表:regedit 打开路径: HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlS ...

  3. [并查集] POJ 1703 Find them, Catch them

    Find them, Catch them Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 43132   Accepted: ...

  4. 修改UISearchBar的背景颜色

    当你看到这篇博客你就已经发现了用_searchBar.backgroundColor = [UIColor clearColor];来设置UISearchBar的颜色完全没有效果: 并且,有些方法是想 ...

  5. DIV的不能包住子集解决办法

    在div的样式中加上:overflow:hidden,或者float:left或right

  6. 仓储管理系统500bug记录一下mysql 8小时超时解决办法

    HTTP Status 500 - Request processing failed; nested exception is org.springframework.dao.TransientDa ...

  7. DataStructure——红黑树学习笔记

    1.前言 本文伪码和解释参考: http://blog.csdn.net/v_JULY_v/article/details/6105630 C实现的源码本文未贴出,请见: http://blog.cs ...

  8. 第一次用golang写个小程序

    1.下载go1.6并安装.我是win7系统(会自动添加GOOROOT环境变,自己建一个放go文件的工程目录并添加到环境变量中) 2.下载liteide并解压缩.(liteide查看菜单中也可编辑环境变 ...

  9. LINUX centos 忘记密码

    entos7采用的是grub2,和centos6.x进入单用户的方法不同.但是因为用的是真机环境无法截图,所以只是大概描述以下思路. init方法 1.centos7的grub2界面会有两个入口,正常 ...

  10. extern引发的闹剧

    最近一个朋友让我帮他解决一个问题,由于源代码不方便贴出来,所以就自己写了个demo把问题重现一次 1.新建一个application,添加一个继承于NSObject的类 本来是随便写的,就将此类命名为 ...