html设置虚线边框的方法_HTML/Xhtml_网页制作
程序员文章站
2022-03-19 12:41:16
...
用到CSS样式和HTML标签元素
为了对html不同标签加边框虚线,我们选择几个常用标签对齐设置边框虚线效果。
1、html常用标签
p标签
span
ul li
table tr td
2、实例用到CSS属性单词
border
width
height
3、实现虚线的CSS重点介绍
border为边框属性,如果要实现对象边框效果,要设置边框宽度、边框颜色、边框样式(实线还是虚线)
border:1px dashed #F00 这个就是设置边框样式宽度为1px,虚线,虚线为红色。
4、实例描述
我们对以上几个标签设置相同宽度、相同高度、边框效果。
5、完整HTML代码:
html边框虚线演示 www.pcss5.com - .bor{border:1px dashed #F00;width:300px;height:60px;margin-top:10px} span{display:block}/*css注释说明:让span形成块*/
p盒子
- span盒子
- ul li列表
- ul li列表
表格 表格2 数据 数据2
以上实例对html中不同标签设置相同的样式,包括相同边框虚线。
6、浏览器效果截图
html不同标签设置边框虚线效果截图
推荐阅读
-
防止用户将表单重复提交的方法汇总_HTML/Xhtml_网页制作
-
input,button制作按钮IE6,IE7点击时1px黑边框的解决方法_html/css_WEB-ITnose
-
改进网站设计提供的有意的建议_HTML/Xhtml_网页制作
-
超链接图标规范:提升文章的可阅读性_HTML/Xhtml_网页制作
-
网页设计之网页音乐的实现技巧_HTML/Xhtml_网页制作
-
超链接图标规范:提升文章的可阅读性_HTML/Xhtml_网页制作
-
添加和删除HTML节点的简单示例_HTML/Xhtml_网页制作
-
HTML表格标记教程(45):表格的表主体标记_HTML/Xhtml_网页制作
-
用CSS设置Table的细边框的最好用的方法_html/css_WEB-ITnose
-
XHTML教程:针对初学者的XHTML基础_HTML/Xhtml_网页制作