最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

总结CSS的常用样式

来源:懂视网 责编:小采 时间:2020-11-27 18:50:19
文档

总结CSS的常用样式

总结CSS的常用样式: css 说的通俗一点就是 给标签加样式的。什么玩意是样式呢。你们可以理解为人穿的衣服,化妆之类的修饰,让自己的写的标签变的好看一点那么这个css 怎么加到对应的标签上面去呢 有3种方法 分别是 外部样式、内页样式、行内样式。那么这个css 怎么加到对应的
推荐度:
导读总结CSS的常用样式: css 说的通俗一点就是 给标签加样式的。什么玩意是样式呢。你们可以理解为人穿的衣服,化妆之类的修饰,让自己的写的标签变的好看一点那么这个css 怎么加到对应的标签上面去呢 有3种方法 分别是 外部样式、内页样式、行内样式。那么这个css 怎么加到对应的

css 说的通俗一点就是 给标签加样式的。什么玩意是样式呢。你们可以理解为人穿的衣服,化妆之类的修饰,让自己的写的标签变的好看一点

那么这个css 怎么加到对应的标签上面去呢

有3种方法 分别是 外部样式、内页样式、行内样式。

那么这个css 怎么加到对应的标签上面去呢 
有3种方法 分别是 外部样式、内页样式、行内样式。

外部样式:将网页链接到外部样式表。
比如这个样子:
<link rel="stylesheet" type="text/css" href="xiaochuan.css">
内页样式:在网页上创建嵌入的样式表
比如这个样子:
<style>
body{
	
}
</style>
行内样式:应用内嵌样式到各个网页元素。
比如这个样子:
<p style='color:#999999'>xiaochuan</p>

那比如说我这三个 样式都针对 某一个标签
他的优先级是什么样子的呢?
行内样式 > 内页样式 > 外部样式
怎么理解呢
比如:
行内样式 设置文字大小为 14px
内页样式 设置文字大小为 15px
外部样式 设置文字大小为 16px

那么这边标签的 设置文字大小为 14px

css 语法
标签选择符方式 这是针对页面上面对应的所有标签都会生效
p{
	color:#999999
}

<p >xiaochuan1</p>
<h1 >xiaochuan2</h1>
类选择符 这是针对页面上面标签中class属性存在对应类名都会生效
.xiao{
	color:#999999
}

<p class='xiao'>xiaochuan1</p>
<p >xiaochuan2</p> 
ID选择符 这是针对页面上面标签中id属性存在对应类名都会生效 切记这个只能用一次。有可能说某些浏览器可以无限使用但是不建议使用多次
#xiao{
	color:#999999
}

<p id='xiao'>xiaochuan1</p>
<p >xiaochuan2</p> 

关联选择符 这是针对页面上面对应格式的所有标签都会生效
p span{
	color:#999999
}

<p><span>xiaochuan1</span></p>
<p><a>xiaochuan2</a></p>
组合方式 这是针对页面上面对应的所有标签都会生效
h1, h2{ 
	color: red; 
}
<h1>xiaochuan1</h1>
<h2>xiaochuan2</h2>
<h3>xiaochuan3</h3>


如果我们这边需要对某个标签定义多个css怎么去写呢
格式为 样式的名称:样式的值; 
如果写单个的话分号可以进行省略,最后一个分号也可以省略
<p style='color:#999999'>xiaochuan</p>
<p style='color:#999999;color:font-size:9pt'>xiaochuan</p>

css 属性赋值
css 有的属性是有多个值的 当然也可以多个赋值 也可以直接赋值给一个
我这边就说一下margin 吧
margin:10px;
	这个代表的意思为
	所有 4 个外边距都是 10px

margin:10px 5px;
这个代表的意思为
	上外边距和下外边距是 10px
	右外边距和左外边距是 5px

margin:10px 5px 15px;
这个代表的意思为
	上外边距是 10px
	右外边距和左外边距是 5px
	下外边距是 15px

margin:10px 5px 15px 20px;
这个代表的意思为
	上外边距是 10px
	右外边距是 5px
	下外边距是 15px
	左外边距是 20px
当然如果搞不懂直接 
margin-left
margin-top
margin-right
margin-bottom
这样也可以


我这边整理了一下 经常会在项目中用到的一些样式
color 设置文字颜色
font-family 定义文字字体
font-size 设置文字的大小
font-style 设置 文字斜体
line-height 设置行高
text-align 文字的对齐方式
list-style-type 列表样式 
background 定义背景 可以设置 颜色图片之类的
cursor 设置鼠标的形状 
border 设置标签的边框
margin 设置标签的外边距
padding 设置标签的内边距
position 定位
overflow 溢出
float 浮动
width 设置宽
height 设置高

a 标签这个比较特别 
a 所有超链接
a:link 超链接文字格式
a:visited 浏览过的链接文字格式
a:active 按下链接的格式
a:hover 鼠标转到链接

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文档

总结CSS的常用样式

总结CSS的常用样式: css 说的通俗一点就是 给标签加样式的。什么玩意是样式呢。你们可以理解为人穿的衣服,化妆之类的修饰,让自己的写的标签变的好看一点那么这个css 怎么加到对应的标签上面去呢 有3种方法 分别是 外部样式、内页样式、行内样式。那么这个css 怎么加到对应的
推荐度:
标签: 样式 的样式 css
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top