html基础内容样式

head

<meat charset="utf-8" /> 编码格式：让浏览器可以识别中文

<meat name="Author" content="歪哥"> 作者

<meta name="keywords" content="百度，淘宝，歪哥"> 关键字：用户搜索的时候可以通过关键字搜索到该网页

<meta name="description" content="这是一个非常强大的第三网站...> 网站的描述信息

body

h1~h6:标题标签，重要性依次递减，字体默认加粗，一般作为文章的标题使用

<p></p> p标签：段落标签

<br> 换行标签

&nbsp； 牛逼的空格

<hr> 水平线

&lt; <

&gt; >

<q></q> " "

<blockquote></blockquote> 引用别人一段话

<strong></strong> 强调文本为重要文本，字体加粗

<em></em> 强调文本为重要文本，字体倾斜

 上标

 下标

<img src="网络路径 本地路径 相对路径"> 一般写相对路径

./ 例如：./girl.jpg 当前目录，可以省略

../ .. /girl.jpg 跳到上级目录

<img alt=" "> 图片加载失败的时候，显示的替换文本

<img title=" "> 鼠标悬浮在元素上时显示的内容

<a href=" " target=" "></a> href:超链接，网页之间的纽带

target＝“_blank” 代表在新的网页中打开地址

target＝“_seft” 默认值，代表在当前页打开地址

<a href="#">回到顶部</a> 回到网页顶部

<a href="#teacher">讲师</a> 设置锚点, 可以跳到 id 为 teacher的元素

<a href="img.zip">下载图片</a> 下载

<ul><li></li></ul> 无序列表

<ol><li></li></ol> 有序列表

<dl> <dt><dd></dd></dt></dl> 自定义列表

表格

border:边框

cellspacing: 单元格之间的距离

cellpadding: 单元格和内容之间的距离

align: 对齐方式

align="left" 居左对齐

align="right" 居右对齐

align="center" 居中对齐

<caption>花</caption> 标题

<tr> </tr> 表格的行 给tr添加align＝“center”他的自代元素都会居中对齐

<th></th> <td></td> 表格的列 th: td的一个变种，字体默认加粗，居中

<td rowspan="2"> rowspan:行的跨度

<td colspan="2" align="center" bgcolor="red">

colspan:列的跨度 bgcolor：背景颜色

<tfoot> </tfoot> 表尾

tfoot:写在tbody上方，并不影响页面中的显示效果，但可以让用户优先看到tfoot中的内容

css样式

<link rel="stylesheet" type="text/css" href="index02.css">

type:类型，表示浏览器解析的方式，如果不定义的话，有些css效果浏览器解释的效果不一样

width:200px; 宽度

height:200px; 高度

background:green; 背景颜色

text-align:center; 对齐方式

color:white; 设置字体颜色

选择器

div>p 子代选择器

div p 后代选择器

ul+p 相邻兄弟选择器 选择和ul相邻的选则器

* 选择所有元素

＃ id选择器

. class选择器

属性选择器

div[id] 选中具有id属性的

div[class] 选中具有class属性的div

div[class|="home"]选择class为home的div元素，或着选中class为home开头 后面内容用 － 链接的div元素

div[class="a c"] 选中class为ac属性的

div[class~="a"] 选中包含a属性的

div[class^="r"] 选择以属性名开头的元素

div[class$="x"] 选择以属性名结尾的元素

div[class*="i"] 选中属性中包含该值的元素