在网站的◢前端制作□□中，会遇到大□□□大小小很□□多问题，要学会去□□□避免产生□□□□一些不必□□□□要的问题，在页面的□□布局中，要注意p标签是用□□□□来放文字，而不是布□□□□局的，img如果需要□□□□换行，可以设置□□样式display: block; 这个比用□□□□块级元素□□包裹img或者用<br>来换行好□□一些。加上margin: 0 auto;
Img 就可以水平居中了。如果需要垂直居中，可以用position和 transform，例如：
如果想要水平垂直居中，可以如下图：
用display: flex; align-content: center; justify-content: center;也能达到想要的水平垂直居中效果，需要考虑兼容性。
有时候，会遇到文□□字搭配其□□□他元素的□□□布局，不要直接□□□□把文字和□□□□元素写在□□□□一起，否则有可□□□能会导致♦页面的布□□□□局出现混丨乱。margin对内联元□□素是起不□□了作用。:before 和 :after这两个伪□□□□元素，当单个冒□□□号的时候□□□是css3的伪类，两个冒号□□□的是css3的伪元素。代码的顺□□□序上，这个:before也比:after前。
vertical-align 是一个比□□□□较好用的css属性，是设置行□□内元素和□□表格元素□□的垂直对◉齐的，但是不能□□□□用于对齐✦块级元素□□□□的。
最近遇到一个需要做的样式，如下图：
那么就可以用<sup><code>st</code></sup>，然后设置sub的样式为： position: relative;
vertical-align: super; 就可以得□□□□到想要的□□□□效果。vertical-align的值有sub、super、text-top、text-bottom、 middle、baseline，分别是基□□□线基于父□□元素的下□□□□标基线对□□□齐、父元素的◉上标基线□□对齐、顶部和父□□□□元素的字□□体的顶部□□□□对齐，底部和父◥元素的字☆体的底部□□□□对齐、与父元素□□□□的中间位□□置对齐、父元素的□□□□基线对齐。
最后，记录发现□□□□了一个在○线可以测□□□□试移动端❖兼容性的○网址http://www.responsinator.com/，只要输入需要测试的网址即可。
