1.css样式表分别有：

　　内联样式表

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

<style>

    //这个是内联样式表<style></style>这里面可以书写css样式

</style>

</head>

<body>

   <div style="这个也是内联样式表"></div>

</body>

</html>

　　外部样式表

<link rel=“stylesheet” type=“text/css” href=“路径” />
外部样式表是从新创建一个专门的css文件在通过路径去链接

　　2.css选择符

　　选择符{属性:属性值;属性:属性值;}

　　例：

　　div{width:200px;height:100px;background:red; }

　　每个CSS样式由两部分组成，即选择符和声明，声明又分为属性和属性值

　　属性必须放在花括号中，属性与属性值用冒号连接。

　　每条声明用分号结束。

　　当一个属性有多个属性值的时候，属性值与属性值用空格分隔。

　　在书写样式过程中，空格、换行等操作不影响属性显示。

　　3.css选择符

　元素选择符也可以叫类型选择符：
　　例: 
　　　　　<div> <header> <nav> <footer> <figure> ...
　　通配符
　　　例：
　　　　　　*（号选择所有）
　　id选择符：
　　　例：
　　　　　　<div id="这个就是id选择符是写在标签里面的"></div>（id=“里面的可以随便写比如a/b/s/xdv/sv/等但必须要写在双引号里面才可以”）
　　class选择符：
　　　例：
　　　　　　<div class="这个就是class选择符跟id选择符是一样都必须要写在双引号里面"></div>
　　群组选择符：
　　　例：　　　　

　　　　div , .hehe , p , #top {background:red;}  同时对多个选择符设置同一个样式 选择符与选择符之间用逗号分隔

　　后代选择符：
　　　　例：
　　　　　　#nav   ul   li {background:red;}
　　　　　　缩小范围去选择元素 选择符与选择符之间用空格分隔
　　伪类选择符：
　　　　例：
　　　　　　　　a:link {属性:属性值;} 初始化状态
　　　　　　　　a:visited {属性:属性值;} 被点击后的状态
　　　　　　　　a:hover {属性:属性值;} 当鼠标滑过时候的状态
　　　　　　　　a:active {属性:属性值;} 当鼠标按下时候的状态

　　　　　　　　伪类选择器只能给特殊的带有href属性的a标签使用 并且只有在特殊的条件下才会有效果
 

　　4.选择符的优先级

选择符的优先级即选择符的权重 针对同一个元素或同一群元素 进行选择时起的冲突进行的优先选择的处理。

    内联样式的权重为

    id选择符的权重为

    class选择符的权重为     　

    伪类选择符的权重为     　　

    元素选择符的权重为     　　

    继承样式的权重为

    后代选择符的权重：为后代选择符的权中之和

　　5.文本的属性

　　文本大小及单位

　　文本大小 (设置字体的大小 通常网页字体为12px或14px)

　　font-size:12px;

　　单位 (通常单位为像素)

　　px像素 pt点 em倍距

　　3pt=4px

　　em是根据自身的字体大小来决定多少像素

　　元素的默认大小是16px

　　1em=16px

　　文本的属性

    font-style:normal/ italic [设置文本为斜体]

    font-weight:normal(-)/ bold(-)    [设置文本为粗体]

    font-family: “文本字体1”,”文本字体2”; [文本类型]

    text-align:left/center/right/justify [文本水平对齐方式]

    vertical-align:top/middle/bottom[垂直对齐方式]

    line-height:数字px;[设置文本在一行内的高度]

    设置文本简写方式

    font:加粗 倾斜 文本大小/行高  “字体”;

　　文本的颜色

　颜色属性

十六进制值

#f00     #fa0000   red

颜色模式：光色模式

  R      G      B

FF           00
当然除了这个还可以用一些对应的单词

　　文本修饰

text-decoration 文本修饰

none:没有修饰

underline:添加下划线

overline:添加上划线

line-through:添加删除线

text-indent 首行缩进

　　6.背景的设置

背景颜色

background-color:#f00;

背景图片

background-image:url(图片路径);

背景图片平铺属性

background-repeat:

repeat         默认平铺

repeat-x     横向平铺

repeat-y    纵向平铺

no-repeat     不平铺

背景图位置

background-position:值1(水平)   值2(垂直)

left/center/right/数值     top/center/bottom/数值

数值可以设置负值

背景简写：

background:颜色   图片路径    是否平铺     位置;

小扩展常用图片格式

jpg    (图片有损质量 但肉眼难分辨 来减小图片大小  图片非搂空使用);

png    (图片有损质量 但肉眼分辨不出 来减小图片大小  搂空图片使用的格式)

gif    (图片有损严重 肉眼容易分别 常用与做动图)

　　7.浮动属性

float:

none     默认不浮动

left       左浮动

right     右浮动

　　8.列表li相关独有属相

list-style-type[设置列表符号]

 disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉列表符号)；

list-style-image:url(路径); [自定义图片列表符号]

list-style-position:outside(默认外边)/inside(里边)；[定义符号所在位置]

list-style:none;去掉列表符号

　　

css的一些基础方法的更多相关文章

  1. css+js+html基础知识总结

    css+js+html基础知识总结 一.CSS相关 1.css的盒子模型:IE盒子模型.标准W3C盒子模型: 2.CSS优先级机制: 选择器的优先权:!important>style(内联样式) ...

  2. （1） css的核心基础

     css的核心基础 1.css的基本语法在具体使用css之前,请各位兄弟姐妹先思考一个生活中的问题,一般情况下我们是如何描述一个人的呢? 小明{ 民族:汉族: 性格:温柔: 性别:男: 体重:68kg ...

  3. (五)CSS和JavaScript基础

    DHTML :制作动态HTML页面的技术 DHTML=HTML+层叠样式表CSS+脚本语言javascript 一.CSS 1.1 CSS样式的分类: 行内样式:只影响一行,其他相同标签也不影响.如下 ...

  4. HTML+DIV+CSS+JSweb前端基础

    HTML+DIV+CSS+JSweb前端基础 1.<html>和</html> 标签限定了文档的开始和结束点. 属性: (1)  dir: 文本的显示方向,默认是从左向右 (2 ...

  5. 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记

    [CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...

  6. 为IE单独写CSS的三种方法

    本文由 Kayo Lee 发表,本文链接:http://kayosite.com/the-methods-make-css-only-for-ie.html 因为万恶的 IE 存在各种的不标准,因此, ...

  7. 三种纯CSS实现三角形的方法

    看到像上图这样的 tip 的小三角,你会怎么办? 切个图上去?恩,不错,简单,兼容性也一级棒,不但好控制,那点小东西也增加不了多少图片的大小.但有没有更好更讲究技巧的办法呢?哈哈,那必须有啊,而且还不 ...

  8. CSS清除浮动的方法

    CSS清除浮动的方法有哪些呢?经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一.下面看今天的 ...

  9. CSS中垂直居中的方法

    昨天总结了css中水平居中的方法,今天来总结一下css中实现垂直居中的方法. line-height line-height用于实现单行文本的垂直居中,如下图中,我们要求单行文本垂直居中,只需要将di ...

随机推荐

  1. Facebook币Libra学习-5.Move组织目录

    Move是一种新的编程语言,旨在为Libra Blockchain提供安全可编程的基础. 组织 Move语言目录由五部分组成: 的虚拟机(VM),其中包含的字节码格式,字节码解释器,和基础设施执行事务 ...

  2. python笔记4 内置函数,匿名函数.递归函数 面向对象(基础, 组合,继承)

    内置函数 eval和exec eval :执行字符串中的代码并将结果返回给执行者,有返回值 exec:执行字符串中的代码,往往用于执行流程语句,没有返回值. s1 = '1+2' s2 = 'prin ...

  3. SQL-W3School-高级：SQL 数据类型

    ylbtech-SQL-W3School-高级:SQL 数据类型 1.返回顶部 1. Microsoft Access.MySQL 以及 SQL Server 所使用的数据类型和范围. Microso ...

  4. [Java读书笔记] Effective Java(Third Edition) 第 4 章 类和接口

    第 15 条: 使类和成员的可访问性最小化 软件设计基本原则:信息隐藏和封装. 信息隐藏可以有效解耦,使组件可以独立地开发.测试.优化.使用和修改.   经验法则:尽可能地使每个类或者成员不被外界访问 ...

  5. 【思考】为什么说Bagging减少variance，Boosting减少bias？（转载）

    具体讨论可见于此知乎问题,有很多种理解方向,甚至这一个命题可能本来就不成立!

  6. unfortunately 遗憾的是

    Yet,unfortunately,when it comes to the time for you to talk about these topics in English,......(unf ...

  7. Product - 产品经理 - 知返

    特别说明 本文是已读书籍的学习笔记和内容摘要,原文内容有少部分改动,并添加一些相关信息,但总体不影响原文表达. - ISBN: 9787568041591 - https://book.douban. ...

  8. 02.02 lamp环境搭建笔记

    lamp环境 在linux中安装 apache.mysql.php三种软件环境,同时需要安装他 某些插件. cp /etc/apt/sources.list /etc/apt/sources.list ...

  9. windows下libnet ARP

    查找自己的网卡: #include <libnet.h> #include <stdio.h> #include <iostream> #pragma commen ...

  10. ML.NET 1

    ML.NET 示例:目录 ML.NET 示例中文版:https://github.com/feiyun0112/machinelearning-samples.zh-cn英文原版请访问:https:/ ...