前端开发工具：Dreamweaver、Hbuilder、WebStorm、Sublime、PhpStorm...==========================================================head头的本质：优化页面，利于搜索；设置字符集，防止乱码；引入外部样式方便；规定呈现样式。===========================================================<meta name="keyword" content="PHP、JS、CSS"><meta name="description" content="PHP、JS、CSS">===========================================================<hr size="100" width="200">size就是高度===========================================================<big>hello html</big>比默认的大一个号的字体（如果已经最大，就无效）<small>hello html</small>比默认的小一个号的字体（如果已经最小，就无效）=========================================================================<sub>显示在右下角<sup>显示在右上角=================================================================斜体效果的一些标签：<i>你好i</i><em>你好em</em><cite>你好tite</cite><address>你好address</address>其中address是块级元素，独占一行，其他三个是行级元素。=================================================================css的样式：<img src="1.jpg" width="100" height="100"><img src="1.jpg" style="width:100px;height:100px;">使用style时需要加单位。====================================================================text-indent: 2.5em；首行缩进==================================================================在table元素中边框亮边线，是指表格的左侧和顶部的边线：bordercolorlight；
在table元素中边框暗边线，是指表格的右侧和底部的边线：bordercolordark；====================================================================设置表格的背景颜色：bgcolor，background，bgcolor可以设置body标签和table相关标签的背景颜色，示例：<table bgcolor="red"></table>background必须写进style中。bgcolor不写在style中。==================================================================table相关标签：table、thead、tbody、th、caption、tr、td、tfoot。<table style="border:1px solid #ccc;"> <caption> 我是表格标题caption </caption>
<thead> <tr> <th>姓名</th> <th>年龄</th> </tr> </thead>
<tbody> <tr> <td>张三</td> <td>12</td> </tr> </tbody>
<tfoot> <tr> <td>合计</td> <td>100</td> </tr> </tfoot>
</table>================================================================align 设置左右对齐方式（left、right、center）valign 设置上下对齐方式（top、bottom、middle）===============================================================img的border-radius可以设置边角的弧度，如果宽高一样，弧度50%时图片显示圆形；如果宽高不一样，弧度50%时显示椭圆形；<img src="1.jpg" style="width:1080px;border-radius:50%;">
opacity:0.5;设置图片透明度<img src="1.jpg" style="width:1080px;opacity:0.5;">==================================================================css中属性选择器：[alt="php"]{border:5px solid red;}设置属性alt的值为php的元素样式；[alt][title]{border:5px solid red;}设置拥有属性alt和title的元素的样式；[alt^="php"]{border:5px solid red;}设置属性alt的值为php开头的元素样式；[alt$="php"]{border:5px solid red;}设置属性alt的值为php结尾的元素样式；[alt~="php"]{border:5px solid red;}设置属性alt的值包含php的样式（字符之间以空格隔开）；[alt|="php"]{border:5px solid red;}设置属性alt的值包含php的样式（字符之间以-隔开）；=====================================================================================伪类选择器：li:first-child{color:red;} //第一个lili:last-child{color:red;} //最后一个lili:nth-child(5){color:red;}//第五个lili:nth-child(odd){color:red;}//第奇数个lili:nth-child(even){color:red;}//第偶数个li================================================================================+表示同级且相邻：h1+h2{color:red;}//表示设置与h1相邻的同级的h2元素的颜色，不包括h1，必须是下一个元素，不能是上 一个；h1~h2{color:red;}//表示设置与h1同级的所有的h2元素的颜色，不包括h1，也不包括h1之前的h2元素;==========================================================================================text-indent:2em;//缩进两字符==================================================================================cellspacing 外边距cellpadding 内边距=================================================================================
转载于:https://www.cnblogs.com/gyfluck/p/10115473.html
