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元素.包括对字体.颜色.边距.高度.宽度.背景图片.网页定位等 ...

随机推荐

c++判断当前登录账户是否在域环境内
#include <Windows.h> #include <DSRole.h> #pragma comment(lib, "netapi32.lib") ...
boost多线程编译出错
添加 -lpthread CPLUS_INCLUDE_PATH=$CPLUS_INCLUDE_PATH:/tools/boost/includeexport CPLUS_INCLUDE_PATH LI ...
[易学易懂系列|rustlang语言|零基础|快速入门|（6）|变量绑定]
[易学易懂系列|rustlang语言|零基础|快速入门|(6)] 有意思的基础知识变量绑定我们现在回过头来看看,一些基础知识. 因为理解了前面的重要概念:所有权,借用,生命周期. 我们现在看基础知 ...
pytho xml
转载自:https://www.cnblogs.com/gouguoqilinux/p/9168332.html xml是实现不同语言或程序直接进行数据交换的协议,跟json差不多,单json使用起来 ...
2019强网杯web upload分析(pop链)
参考链接:https://blog.csdn.net/qq_41173457/article/details/90724943 注意只要namespace相同那就可以直接实例化同一namespace ...
【NOIP2016提高A组模拟8.17】(雅礼联考day1)总结
考的还ok,暴力分很多,但有点意外的错误. 第一题找规律的题目,推了好久.100分第二题dp,没想到. 第三题树状数组.比赛上打了个分段,准备拿60分,因为时间不够,没有对拍,其中有分段的20分莫名 ...
大文件的分片传，断点续传，md5校验
一.概述所谓断点续传,其实只是指下载,也就是要从文件已经下载的地方开始继续下载.在以前版本的HTTP协议是不支持断点的,HTTP/1.1开始就支持了.一般断点下载时才用到Range和Content- ...
（71）一篇文章带你熟悉HTTP协议
作者:涤生_Woo链接:http://www.jianshu.com/p/6e9e4156ece3來源:简书著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 本篇文章篇幅比较长,先 ...
pycharm 安装激活
下载pycharm :http://www.jetbrains.com/pycharm/download/download 安装直到 finish 下载补丁jetbrains-agent.jar并添 ...
swiper实现滑动到某页锁住不让滑动
var swiper = new Swiper('.swiper-container', { pagination: '.swiper-pagination', onTouchStart: funct ...

css简介和属性