html样式是指,带你了解CSS基础知识,样式

什么是CSS

CSS(Cascading Style Sheet):层叠样式表语言。

CSS的作用是:

修饰HTML页面,设置HTML页面中的某些元素的样式,让HTML页面更好看。

在HTML页面中嵌套使用CSS的两种方式

第一种方式:在标签内部使用style属性来设置元素的CSS样式,这种方式称为内联定义方式。语法格式:

标签>

第二种方式:链入外部样式表文件,这种方式最常用。(将样式写到一个独立的xxx.css文件当中,在需要的网页上直接引入css文件,样式就引入了)语法格式:

这种方式易维护,维护成本较低。

xxx.css文件

1.html中引入了

2.html中引入了

3.html中引入了

4.html中引入了

三种方式代码展示

内联定义方式

HTML中引入CSS样式的第一种方式:内联定义方式

样式块方式

HTML中引入样式的第二种方式:样式块方式

/*

这是CSS的注释

*/

/*

id选择器

#id{

样式名: 样式值;

样式名: 样式值;

样式名: 样式值;

........

}

*/

#usernameErrorMsg{

font-size: 12px;

color: red;

}

/*

标签选择器

标签名{

样式名: 样式值;

样式名: 样式值;

样式名: 样式值;

}

*/

div{

background-color: black;

border: 1px solid red;

width: 100px;

height: 100px;

}

/*

类选择器

.类名{

样式名: 样式值;

样式名: 样式值;

样式名: 样式值;

}

*/

.myclass{

border: 2px double blue;

width: 400px;

height: 30px

}

对不起,用户名不能为空!

专科

本科

硕士

链入外部样式表文件

css文件

a{

text-decoration: none;

}

#baiduSpan{

text-decoration: underline;

cursor: wait;

}

HTML中引入CSS样式的第三种方式:链入外部样式表文件

百度

点击我链接百度

以下是常用的样式

边框

(1)

div{ border : 1px solid red; }

(2)

div{ border-width : 1px; border-style : solid; border-color : red; }

隐藏

div{ display : none; }

字体

div{ font-size : 12px; color : red; }

文本装饰

a{ text-decoration : none; }

a{ text-decoration : underline; }

列表

ul{ list-style-type : none; }

设置鼠标悬停效果

:hover

定位

div{ position : absolute; left : 100px; top : 100px; }

鼠标小手

div{ cursor : pointer; }

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望你能够多多关注脚本之家的更多内容!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值