Web前端学习常见问题汇总（第一弹）

1、ul  li不换行，横排样式

 

ul{ list-style:none;margin:0px;}
ul li {float:left;}

 

list-style:none,表示取消列表前面的点；

margin:0px,表示删除UL的缩进

float:left,通过浮动属性，让内容都在同一行显示

 

2、HTML中显示图片的方式

1）HTML标签 img

 

<img src="url" style="width:100px;height:100px">

 

2)CSS 属性 background

.g_con {
      width:30px;
      heigt:30px;
      background:url();
}
<div class="g_icon"></div>

    值的注意的是，url的地址需要注意它的路径问题。/image/xx.png，是指在css文件目录下的imge文件夹下的xx.png。这个可以查浏览器的F12。

3、伪类：after 和 ：before

<div class="mydiv"></div>

.mydiv:after{
     content:url(/i/eg_bg_04.gif);
     width:100px;
     height:100px;
}