css简介以及css的添加方法
什么是css?
CSS是Cascading Style Sheets的简称，CSS是用来美化网页中文称为层叠样式表，用来控制网页数据的表现，可以使网页的表现与数据内容分离。
css的基本语法
1.选择器{属性:值;属性:值;…….}。注意：属性和属性值之间用冒号(:)隔开，定义多个属性时，属性之间用英文输入法下的分号;隔开。
Width:20px;宽
Height:20px;高
Background-color:red;背景颜色
font-size:24px;文字大小
text-align:left | center| right内容的水平对齐方式
text-indent:2em;首行缩进
Color:red;文字颜色
css的添加方法有几种？都有怎样的格式？
1.行内样式 ：行内式是在标记的style属性中设定CSS样式。这种方式没有体现出CSS的优势，不推荐使用！
<!--行内添加法-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<p style="color:red;">
css行内添加法
</p>
</body>
</html>
2.内嵌样式：即使有公共css代码，也是需要定义的，适合文件很少css代码也不多的情况下使用。如果一个网站中有很多的页面，每个文件都会变大，后期维护难度也很大。
<!--内嵌的样式-->
<!DOCTYPE html>
<html lang="en">
<style type="text/css">p{color:red;}</style>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>内嵌样式的表示法</p>
</body>
</html>
3.单独文件样式：页面结构html代码和样式css代码完全分离维护起来比较方便，需要改变网站风格，只需要修改公共文件可以在同一个html文件中内部引用多个外部样式表！
css文件：
style.css
p{colo:red;/*设置文字颜色*/}
html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="外部文件.css">
<head>
<body>
<p>css单独文件添加方法</p>
</body>
</html>
css优先使用那种添加方法？
1.多重样式可以层叠，可以覆盖
2.样式优先级按照"就近原则"
3.行内样式>内嵌样式>链接样式>浏览器默认样式！
css简介以及css的添加方法的更多相关文章
- CSS样式，语法，添加方法，文本，字体
总结一些css的基础知识 ㈠css样式 css:cascading style sheets 层叠样式表 css内容和样式相分离,便于修改样式. ㈡css语法 ㈢css添加方法 ⑴行内添加:放在&l ...
- form表单，css简介，css选择器，css样式操作
form表单 简介 表单在Web网页中用以让访问者输入数据,当提交表单时,表单中输入的数据被打包传递给Web服务器端的程序 以处理,从而使得Web服务器与用户之间具有交互功能. 表单实现前后台交互:用 ...
- CSS简介和CSS选择器
<pre name="code" class="html">Css 简洁 css 选择器 标签选择器 类选择器 ID选择器 Css 层叠样式表 Ca ...
- CSS 简介、 选择器、组合选择器
#CSS 装饰器引入<!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- Bulma CSS - 简介
Bulma CSS框架教程 Bulma CSS – 简介 Bulma CSS – 开始 Bulma CSS – CSS类 Bulma CSS – 模块化 Bulma CSS – 响应式 Bulma是什 ...
- CSS 简介
CSS 简介 需要具备的基础知识 在继续学习之前,你需要对下面的知识有基本的了解: HTML XHTML CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义 ...
- 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记
[CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...
- CSS导航菜单水平居中的多种方法
CSS导航菜单水平居中的多种方法 在网页设计中,水平导航菜单使用是十分广泛的,在CSS样式中,我们一般会用Float元素或是「display:inline-block」来解决.而今天主要讲解如何让未知 ...
- html5快速入门（二）—— CSS简介
前言: 1.HTML5的发展非常迅速,可以说已经是前端开发人员的标配,在电商类型的APP中更是运用广泛,这个系列的文章是本人自己整理,尽量将开发中不常用到的剔除,将经常使用的拿出来,使需要的朋友能够真 ...
随机推荐
- 波士顿房价预测 - 最简单入门机器学习 - Jupyter
机器学习入门项目分享 - 波士顿房价预测 该分享源于Udacity机器学习进阶中的一个mini作业项目,用于入门非常合适,刨除了繁琐的部分,保留了最关键.基本的步骤,能够对机器学习基本流程有一个最清晰 ...
- 使用Hexo开源博客系统，轻松搭建你的个人博客（1）
Hexo 是一个轻量级.简洁.高效且高逼格的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页.同时有着丰富的主题,官网或者GitHub都可 ...
- redis列表底层实现之一——链表
注意标题中的“之一”,那么什么情况下,列表会使用链表作为其数据结构呢? 答案就是——列表键包含了大量的元素,或者列表中包含的元素都是比较长的字符串. Ok,由于链表大家都比较熟悉,接下来就直接给出链表 ...
- python Django中的cookie和session
目录 Cookie 1.1获取Cookie 1.2设置Cookie Session 1.数据库Session 2.缓存Session 3.文件Session 4.缓存+数据库Session Cooki ...
- 手把手带你体验Stream流
前言 只有光头才能变强. 文本已收录至我的GitHub仓库,欢迎Star:https://github.com/ZhongFuCheng3y/3y 上一篇讲解到了Lambda表达式的使用<最近学 ...
- Linux内存描述之高端内存–Linux内存管理(五)
服务器体系与共享存储器架构 日期 内核版本 架构 作者 GitHub CSDN 2016-06-14 Linux-4.7 X86 & arm gatieme LinuxDeviceDriver ...
- Pandas处理日常EXCEL表格的便捷操作
第一次写博客,写的可能有点乱,有问题可以一起探讨.格式可能控制也不是太好. 1.日常的数据集大多带有中文格式,例如“公务员招聘岗位汇总.xls”.我们使用pandas的read_csv()函数读取可能 ...
- 分享：JS视频在线视频教程
作者说明 (1)JS说明 JS是非常重要的一门语言,但是,我们对JS的认识似乎仍然停留在“hello word”或者“alert”的观念上.其实,JS发展到现在已经非常的成熟,功能也非常的强大,因此, ...
- Java之微信公众号开发
这次以文本回复作为案例来讲解Java相关得微信公众号开发. 首先必须要有一个个人微信公众号 个人微信公众号相关的接口权限有限,不过用于个人学习体验一下足够了,如图: 然后进入微信公众后台,点击基本配置 ...
- 微信小程序中事件
微信小程序中事件 一.常见的事件有 类型 触发条件 最低版本 touchstart 手指触摸动作开始 touchmove 手指触摸后移动 touchcancel 手指触摸动作被打断,如来电提醒,弹窗 ...