html小知识点汇总(浏览器导航上显示图标、div无高度时试着清除浮动、文字环绕图片、字体加粗、div按百分比分、已有的不合适的class,针对特定的标签进行修改)

1.新点击的网页,在浏览器导航上显示图标:

像这种效果:

1  <head>
2      <meta charset="UTF-8">
3     <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
4     <title>标题</title>   
5    <link rel="shortcut icon" href="图片路径">   
6 </head>
只需在head里插入“<link rel="shortcut icon" href="图片路径"> ”。

2.专业术语叫“float引起的div自适应高度无效的解决方案”,其实就是当div无高度时,你要试着清除浮动:

1 .clear
2 {
3     clear:both;
4 
5 }  

3.文字环绕图片

<p><img src="图片相对路径" width="239" height="227"  alt="" style="float:right;"  /> 文字<br>另分段的文字</br>文字</p>

即width="239" height="227"必须有,style="float:right;" 控制放哪边(记得下一步清除浮动,可能不清也没事,以实际情况为主),<br>另分段的文字</br>可实现分段。

 

4.字体加粗:

  1、在html对对象直接加粗可以用<b><strong>对其加粗
  2、使用CSS加粗对象可以使用font-weight:bold即可实现加粗。

5.把div按百分比分了:

1 <div>
2 <div id="main" style="width:800px;  height:400px;">
3 <div id="left" style="float:left ;  width:50%;  height:100%;"></div>
4 <div id="right" style="float:left ;  width:50%; height:100%;"></div>
5 
6 </div>

 

6.对已有的不合适的class,针对特定的标签进行修改:(以a标签的hover事件为例)

1 $(".对应标签的类名").hover(function () {
2     $(".对应标签的类名").css("background-color", "transparent");
3     $(".对应标签的类名").css("text-decoration", "underline");
4 }, function () {
5     $(".对应标签的类名").css("background-color", "transparent");
6     $(".对应标签的类名").css("text-decoration", "none");
7 });
posted @ 2017-01-05 10:06  wx_h13813744  阅读(320)  评论(0编辑  收藏  举报