CSS 为页面加一点样式(简单的属性及<link>)
2017-01-29 21:01
513 查看
CSS中的每个语句包括一个场所(如卧室),以及这个场所的一个属性(如窗帘或地毯),还要运用这个属性的一个样式(如颜色)。
Bedroom{
drapes:blue;
}
推荐一本小书——《CSS Pocket Reference》
规则:p{ 其中整体为规则,p所在的位置为选择器。CSS规则要放在
Color:red; <style>元素中
}
A.今天学到的一些属性
background-color:red; 背景色
border:1px solid black; 边框,粗细为一像素,实线,黑色。
color:maroon; 字体颜色,茶红色(增加之后,链接的颜色没有变)
font-family:sans-serif; 将font-family改为sans-serif
border-bottom:1px solid black; 控制元素下边框的外观,较下划线underline粗一些,会延伸至页面边缘
text-decoration:underline; 下划线
B.技巧
为多个元素编写一个规则,只需要在选择器之间加上逗号。(h1,h2{})
为多个页面统一样式:
1、取出“lounge.html”中的规则,(不要style)将他们放在一个名为lounge.css的文件中
2、从lounge.html中建立一个到这个文件的外部链接
<link rel=”stylesheet” href=”lounge.css”> rel属性指定了HTML文件与所链接文件之间的联系
我们要连到是一个样式表,所以用stylesheet
Link是一个void元素
3、在其他页面建立链接
4、测试
Bedroom{
drapes:blue;
}
推荐一本小书——《CSS Pocket Reference》
规则:p{ 其中整体为规则,p所在的位置为选择器。CSS规则要放在
Color:red; <style>元素中
}
A.今天学到的一些属性
background-color:red; 背景色
border:1px solid black; 边框,粗细为一像素,实线,黑色。
color:maroon; 字体颜色,茶红色(增加之后,链接的颜色没有变)
font-family:sans-serif; 将font-family改为sans-serif
border-bottom:1px solid black; 控制元素下边框的外观,较下划线underline粗一些,会延伸至页面边缘
text-decoration:underline; 下划线
B.技巧
为多个元素编写一个规则,只需要在选择器之间加上逗号。(h1,h2{})
为多个页面统一样式:
1、取出“lounge.html”中的规则,(不要style)将他们放在一个名为lounge.css的文件中
2、从lounge.html中建立一个到这个文件的外部链接
<link rel=”stylesheet” href=”lounge.css”> rel属性指定了HTML文件与所链接文件之间的联系
我们要连到是一个样式表,所以用stylesheet
Link是一个void元素
3、在其他页面建立链接
4、测试
相关文章推荐
- <div+css页面布局课堂笔记>6---与盒子相关的CSS属性第三部分
- html系统学习之六 <CSS所有的样式属性>
- CSS 页面中引用外部 .css 文件(<link />)
- <div+css页面布局课堂笔记>4---与盒子相关的CSS属性
- <div+css页面布局课堂笔记>5---与盒子相关的CSS属性第二部分
- 表格 CSS(不换行) HTML <td> 标签的 nowrap 属性
- 将<div><ul><li>中的数据设置为无编号,横向显示并且居中显示在下方的样式,以及在打开新的页面。
- 区别CSS中display:box;inline;none以及HTML中 <frame> 标签<table> 标签的 frame 属性
- CSS和SVG中的剪切——clip-path属性和<clipPath>元素
- DIV+CSS布局入门示例(四)页面顶部 列表<li>制作菜单
- 如何使用CSS设置<input>标签的背景小图标 简单
- 【CSS技巧】关于<hr>的属性设置
- CSS和SVG中的剪切——clip-path属性和<clipPath>元素
- CSS常用样式简单的总结包括定位、显示等属性
- <hr/>标签的属性及样式
- Css <ul><li>列表的样式的控制</li></ul>
- <link href ="css/index.css" rel="Stylesheet" type="text/css" />
- <P>标签显示滚动条属性(CSS)
- <link rel="canonical">概念和用法(增加页面权重,利于排名)
- css属性列表 和 属性值含义<一>