【前端笔记】在HTML中画一条横线和IE10支持引用的CSS文件
2014-10-02 00:11
399 查看
首先大家国庆节快乐啊~~~ 这是我第一个在省外的国庆节,毕竟今年毕业了哇,奋斗的我们要加油~~~
最近我会不断总结上一个WEB项目所用到的前端知识,和大家一起分享哈~~~
言归正传,怎么画一条横线?我想到的有三种方法,但是各自样式不一,所以大家按需求来哦。
1.<hr />标签,对的,这个标签就代表一条横线,样式大概是这样的,如图(a与b之间哦):
很简单吧
2.<div>来构造,我们知道border是边界的意思,很多时候我们用它设置一些边边框的什么,这里我们就用到了它,看看代码(还是在a和b之间插一个横线):
稍微科普一下,1px代表那个线有多宽的,越大越宽,solid代表它是一个实线,这里还有很多属性如dashed(虚线),groove(凹槽型效果,具体请看Border HTML,当然#CCC就是颜色了。
3.还是<div>来构造,只不过用border-bottom,为什么这么用呢,我们经常用到的横线其实我想就是一个div下面一个属性罢了,而不是单独的一个属性,所以代码有所改变,如下:
今天在帮朋友做一个网站的时候,把写好的CSS放入外部的css文件作引用,可是在火狐,谷歌浏览器都正常显示的情况下,IE10却不能显示,然后找了一下网站的资料,这里感谢百度知道一个网友提供的解决方案(用IE8进行渲染),用IETester测试IE6,也是可以的~~~:
在<head></head>中添加:
<META http-equiv="X-UA-Compatible" content="IE=8" />
这些全部都是在14寸笔记本100%网页浏览器的效果。
好了,祝大家国庆假期快乐!~~~
(转载本站文章请注明作者和出处 Coder的不平凡 ,请勿用于任何商业用途)
最近我会不断总结上一个WEB项目所用到的前端知识,和大家一起分享哈~~~
言归正传,怎么画一条横线?我想到的有三种方法,但是各自样式不一,所以大家按需求来哦。
1.<hr />标签,对的,这个标签就代表一条横线,样式大概是这样的,如图(a与b之间哦):
<html> <head></head> <body> <div>a</div> <hr /> <div>b</div> </body> </html>
很简单吧
2.<div>来构造,我们知道border是边界的意思,很多时候我们用它设置一些边边框的什么,这里我们就用到了它,看看代码(还是在a和b之间插一个横线):
<html> <head></head> <body> <div>a</div> <div style="border:1px solid #CCC"></div> <div>b</div> </body> </html>效果图:
稍微科普一下,1px代表那个线有多宽的,越大越宽,solid代表它是一个实线,这里还有很多属性如dashed(虚线),groove(凹槽型效果,具体请看Border HTML,当然#CCC就是颜色了。
3.还是<div>来构造,只不过用border-bottom,为什么这么用呢,我们经常用到的横线其实我想就是一个div下面一个属性罢了,而不是单独的一个属性,所以代码有所改变,如下:
<html> <head></head> <body> <div style="border-bottom:1px solid #CCC">a</div> <div>b</div> </body> </html>效果图:
今天在帮朋友做一个网站的时候,把写好的CSS放入外部的css文件作引用,可是在火狐,谷歌浏览器都正常显示的情况下,IE10却不能显示,然后找了一下网站的资料,这里感谢百度知道一个网友提供的解决方案(用IE8进行渲染),用IETester测试IE6,也是可以的~~~:
在<head></head>中添加:
<META http-equiv="X-UA-Compatible" content="IE=8" />
这些全部都是在14寸笔记本100%网页浏览器的效果。
好了,祝大家国庆假期快乐!~~~
(转载本站文章请注明作者和出处 Coder的不平凡 ,请勿用于任何商业用途)
相关文章推荐
- Web前端面试题笔记_HTML&CSS篇
- 【前端】HTML入门笔记
- 前端学习笔记--HTML
- HTML笔记五,HTML5的多媒体支持
- WEB前端(HTML、XML、CSS、JS)学习笔记
- EverNote 极致的免费笔记资料管理软件 (数据网络同步、支持PC、Mac与手机多平台) 转自:http://www.iplaysoft.com/evernote.html
- 前端开发学习笔记02----HTML基础
- 前端面试学习笔记之HTML
- 前端学习笔记之页面制作(三)——HTML
- 前端基础笔记HTML&CSS&JS
- 前端-HTML笔记
- web前端——html基础笔记 NO.10
- web前端——html基础笔记 NO.9
- j2ee学习笔记之前端(js、jQuery、html、html5、webService、ajax、css)—— 一直会补充
- web前端——html基础笔记 NO.14{颜色值,长度值}
- 《编写高质量代码-Web前端开发修改之道》笔记--第三章 高质量的HTML
- web前端——html基础笔记 NO.8
- web前端——html基础笔记 NO.12{css布局模型(流动,浮动,层模型)}
- 前端开发学习笔记(三)HeadFirst HTML 与 CSS (第二版)
- 前端学习笔记(二)——html