CSS指的是层叠样式表（Cascading Style Sheets）

样式定义如何显示HTML元素，通常存储在样式表中。

css使用方式

内联式

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>内联样式</title>

</head>

<body>

    <p style="background: red"> I  love  China!</p>

</body>

</html>

内部样式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>内联样式</title> <style type="text/css"> p{ background: green; } </style> </head> <body> <p> I love China!</p> </body> </html>

外部样式

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>内联样式</title>

    <link rel="stylesheet" href="style.css">

</head>

<body>

    <p> I  love  China!</p>

</body>

</html>

CSS语法：

selector {property : value;} 选择器{属性1：值1；属性2：值2；}

常用选择器：

.ClassSelector(类)
#IdSelector(id)
Selector(标签)

基本CSS属性：背景，文本，字体，尺寸，边距和填充，边框

background (背景)

background-color 背景颜色
background-image 背景图像
background-repeat 背景平铺方式或重复
background-attachment 背景图像是否固定或随平面滚动
background-position 背景图像起始位置

Text(文本）

color 颜色
line-height 行高
text-align 文本水平对齐方式
vertical-align 文本垂直对齐方式
Text-indent 首行缩进
Text-shadow 字体阴影
White-space 空白处理方式
Word-spacing 字间距

Font

Font-family 指定文本字体系列
Font-size 指定文本字体大小
Font-style 指定文本字体样式
Font-weight 指定字体粗细

Dimension

height 设置元素高度
Line-height 行高
max-height 元素最大高度
max-width 元素最大宽度
min-heigth 元素最小高度
min-winth 元素最小宽度
width 设置元素宽度

Margin&Padding

Margin

Margin-top 上边距
Margin-bottom 下边距
Margin-left 左边距
Margin-right 右边距

Padding

Padding-yop 上填充
Padding-bottom 下填充
Padding-left 左填充
Padding-right 右填充

Border

Border-top 上边框
Border-bottom 下边框
Border-left 左边框
Border-right 右边框
Border-style 边框样式
Border-width 边框宽度
Border-color 边框颜色

css简介和属性的更多相关文章

【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记
[CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...
2、前端--初见前后端交互、CSS简介、基本选择器、组合选择器、属性选择器、分组与嵌套、伪类选择器
今日内容概要初窥后端框架 css简介 css选择器今日内容详细初次体验前后端交互 # 代码无需掌握只看效果即可 """后端框架:可以简单的理解为别人写好的一个非常 ...
CSS简介，基础选择器，字体属性，文本属性
欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...
html5快速入门（二）—— CSS简介
前言: 1.HTML5的发展非常迅速,可以说已经是前端开发人员的标配,在电商类型的APP中更是运用广泛,这个系列的文章是本人自己整理,尽量将开发中不常用到的剔除,将经常使用的拿出来,使需要的朋友能够真 ...
CSS 简介
CSS 简介需要具备的基础知识在继续学习之前,你需要对下面的知识有基本的了解: HTML XHTML CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义 ...
CSS那些事儿-阅读随笔1（CSS简介与选择符）
最近开始详细钻研CSS有关的知识,参考资料是<CSS那些事儿>.将把在此过程中的收获进行记录,方便以后的学习. 一.CSS简介 1.什么是CSS CSS全称为Cascading Style ...
CSS中Position属性
也许你看到这个标题觉得很简单,确实这是一篇关于CSS中Position属性基础知识的文章,但是关于Position的一些细节也许你不了解. 1.简介 position有五个属性: static | r ...
CSS 简介、选择器、组合选择器
#CSS 装饰器引入<!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
CSS（一）：CSS简介和基本语法
一.CSS简介 1.什么是CSS CSS:Cascading Style Sheet:即层叠样式表.样式定义了如何显示HTML或XHTML元素.包括对字体.颜色.边距.高度.宽度.背景图片.网页定位等 ...

随机推荐

Spring + Mybatis 企业应用实战第1章 Java EE应用
Java EE应用的分层模型: Domain Object 领域对象层.就是一些pojo. DAO(data access object) 数据访问对象 Service 业务逻辑层 Controlle ...
【mysql】全文索引match多列报错
表结构如下: CREATE TABLE `T` ( .... FULLTEXT KEY `title_fc` (`titleindex`), FULLTEXT KEY `shortname_fc` ( ...
【深入理解CLR】2:细谈值类型的装箱和拆箱
装箱总所周知,值类型是比引用类型更“轻型”的一种类型,因为它们不作为对象在托管堆中分配,不会被垃圾回收,也不通过指针来引用.但在许多情况下,都需要获取对值类型的一个实例的引用.例如,假定要创建一个A ...
01-scrapy框架
1.Scrapy图例: Scrapy Engine(引擎): 负责Spider.ItemPipeline.Downloader.Scheduler中间的通讯,信号.数据传递等. Scheduler(调 ...
Selenium 详解xpath定位
xpath定位在业界被戏称为元素定位的"屠龙宝刀",宝刀在手,武林我有.现在我们就来详解xpath定位方法. 一.xpath通过元素属性定位 xpath可以通过元素的属性来定位,如 ...
NOIP2018初赛划水记
尽管初赛好像没什么好写的,但还是以此作为我的第一篇游记吧. 前夜本来以为初赛水(去年分数线36来着),几周前做了一套普及组的卷子90多分感觉良好就没管了(不明白那些专门花时间看初赛书的人),结果Mr ...
Java中String的 "引用" 传递
1.来看一段有趣但又让人困惑的代码片段 public static void main(String[] args){ String x = new String("ab"); c ...
使用GitHub（一）：添加SSHkey
使用GitHub(一):添加SSHkey 本文简单介绍使用GitHub对代码进行版本控制,包括添加SSHkey.配置Git.使用Git创建版本库并在GitHub上进行管理,主要目的是对学习内容进行总结 ...
第四周实验总结&实验报告
实验二 Java简单类与对象实验目的掌握类的定义,熟悉属性.构造函数.方法的作用,掌握用类作为类型声明变量和方法返回值: 理解类和对象的区别,掌握构造函数的使用,熟悉通过对象名引用实例的方法和属性 ...
后盾网lavarel视频项目---1、数据迁移
后盾网lavarel视频项目---1.数据迁移一.总结一句话总结: 1.lavarel的数据迁移比较简单,就是用php来创建数据表 2.创建迁移文件:php artisan make:migrat ...

css简介和属性