CSS
CSS 用于指示 HTML 在浏览器中的显示样式。
CSS 组成
CSS 由选择符(选择器)与声明组成,声明由属性和值组成。
1 | p { |
注释
1 | /* ... */ |
CSS 编写位置
1 | <p style="color:red;font-size:12px">这里文字是红色。</p> |
1 | <style type="text/css"> |
1 | <link href="style.css" rel="stylesheet" type="text/css" /> |
一般写在
里标签选择器
标签指 HTML 中的标签。
类选择器
指定 HTML 标签的class
1 | <span class:"stress">黑色</span> |
为该class
编写 CSS 样式
1 | .stress { |
ID 选择器
指定 HTML 标签的id
1 | <span id:"stress">黑色</span> |
为该id
编写 CSS 样式
1 | #stress { |
ID 选择器只能在 HTML 文档中使用一次,class可多次。
可用 类选择器为标签指定多个样式,id不可以。
子选择器
1 | .food>li{border:1px solid red;} |
指定标签的第一代子元素
包含选择器
通用
1 | * {color:red;} |
伪类
1 | a:hover{color:red;} |
分组
1 | h1,span{color:red;} |
文字
font-famliy font-size color font-weight font-style:italic
text-decoration: underline line-through
text-indent:2em
text-align: center left right
line-weight :2em
letter-spacing word-spacing
盒模型
在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。
常用的块状元素有:
1 | <div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form> |
常用的内联元素有:
1 | <a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code> |
常用的内联块状元素有:
1 | <img>、<input> |
border
border-bottom
布局模型
Flow Float Layer
1 | div{ |