css 介绍

css(层叠样式表)定义如何显示html 元素

当浏览器读到一个样式表, 他就会按照这个表对文档进行格式化(渲染)

css语法

css实例

css 注释

注释是代码之母

/* 这是注释*/

css的几种引入方式

行内样式

行内式 是标记的的style属性中设定的css样式。不推荐大规模使用。

<p style ="color :red">

内部样式

嵌入式是将css样式集中卸载网页的<head></head>标签对的<style></sty

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
p{
background-color:#f5f5f5;
}
</style>
</head>
<body>
<p> 大鑫鑫是姑姑的大宝贝</p>
</body>
</html>

外部样式

外部样式就是将css写在一个单独的文件中, 然后在页面进行引入即可,推荐使用此方式

<link  href ='mystyle.css'  rel='stylesheet' type='text/css'/>

css选择器

基本选择器

元素选择器

 p{color: :"red";}

id选择器

#i1{background-color:red;}

类选择器

.c1{fon-size:14px;
}
p.c1{color:red;
}

注意:

样式类名不要用数字开头,(有的浏览器不认)

标签中的class属性如果有多个要用空格分隔。

通用选择器

前端基础 之css的更多相关文章

  1. 前端基础:CSS样式选择器

    前端基础:CSS样式选择器 CSS概述 CSS是Cascading Style Sheets的简称,中文意思是:层叠样式表,对html标签的渲染和布局.CSS规则由两个主要的部分组成:1.选择器:2. ...

  2. 前端第二篇---前端基础之CSS

    前端第二篇---前端基础之CSS 目录 一.css介绍 二.css语法 三.css的几种引入方式 四.css选择器 五.css属性相关 六.盒子模型 拓展 一.css介绍 CSS(Cascading  ...

  3. 02 前端基础之CSS

    目录 前端基础之CSS css简介 基本选择器(重要) 组合选择器(重点) 属性选择器 分组与嵌套 伪类选择器 伪元素选择器 选择器的优先级 字体相关 背景属性 边框属性 display属性 盒子模型 ...

  4. Web前端基础(4):CSS(一)

    1. CSS介绍 现在的互联网前端分三层: HTML:超文本标记语言.从语义的角度描述页面结构. CSS:层叠样式表.从审美的角度负责页面样式. JS:JavaScript .从交互的角度描述页面行为 ...

  5. 2020年12月-第01阶段-前端基础-HTML CSS 项目阶段(一)

    品优购项目(一) 目标: 能会引入ico图标 能简单看懂网站优化的三大标签 能使用字体图标 ( 重点 ) 能说出我们css属性书写顺序 1. 品优购项目介绍 项目名称:品优购 项目描述:品优购是一个电 ...

  6. 前端基础之css样式(选择器)

    一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...

  7. 前端基础之---css

    css  介绍 css 规则有两个主要的部分构成 : 选择器  , 以及一条或多条声明. 现在的互联网前端分为三层 : ● HTML :超文本标签机语言,从语义的角度描述页面结构. ● CSS : 层 ...

  8. Web前端基础(5):CSS(二)

    1. 盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和I ...

  9. 2021年3月-第02阶段-前端基础-HTML+CSS阶段-Day02

    HTML5 第二天 一.rotate 2d旋转指的是让元素在2维平面内顺时针旋转或者逆时针旋转 使用步骤: 给元素添加转换属性 transform 属性值为 rotate(角度) 如 transfor ...

  10. 前端基础系列——CSS规范(文章内容为转载)

    原作者信息 作者:词晖 链接:http://www.zhihu.com/question/19586885/answer/48933504 来源:知乎 著作权归原作者所有,转载请联系原作者获得授权. ...

随机推荐

  1. On ROWNUM and Limiting Results

    This issue's Ask Tom column is a little different from the typical column. I receive many questions ...

  2. Geeks LCA最低公共单亲节点

    给出一颗二叉树.找到两个值的最小公共节点. 假设两个值都会在树中出现. 假设可能不会出现的话,也非常easy.就查找一遍看两个值是否在树中就能够了.假设不在就直接返回NULL. 基本思想:就是在二叉树 ...

  3. 三星note3 N900刷机包 4.4.2 ZSUDNE3 官方原汁原味 稳定流畅

    ROM介绍 此ROM基于最新的4.4.2 ZSUDNE3 制作,加入一些必要功能,其它性能基本与官方无差距,各方面感觉都非常不错了.此ROM本人自用,所以制作风格有点个人倾向.不论什么建议或者问题欢迎 ...

  4. csslint

    http://csslint.net/ line column title description browserwarning 1 1 Disallow @import @import preven ...

  5. 从模版生成 uri Golang 的 html/template 包不太适合于这种情况

    模板 - Go/Golang 框架 Echo 文档 http://go-echo.org/guide/templates/ Templates | Echo - High performance, m ...

  6. SOAP Only Authentication Using C#

                Jason Lattimer's Blog                 Monday, February 9, 2015 SOAP Only Authentication ...

  7. appium(1)-about appium

    about appium Introduction to Appium Appium is an open-source tool for automating native, mobile web, ...

  8. Android App 启动 Activity 创建解析

    继承实现类关系: ActivityThread  thread = new ActivityThread(); Context->ContextImpl   ContextImpl contex ...

  9. MySQL学习笔记(一)——数据库基础

    自己上大学时也学习过数据库,做开发时也用到过,但是做界面开发对于数据库的使用相对来说是比较简单的,大学时系统学习的数据库也还给老师了,在测试工作中也只是用到了一些基础sql,增删改查这一类的,但是自己 ...

  10. WPF Combo box 获取选择的Tag

    string str1 = ((ComboBoxItem)this.cboBoxRate1553B.Items[this.cboBoxRate1553B.SelectedIndex]).Tag.ToS ...