扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
在css中,主要通过border属性的设置,实现去掉边框。以代码编辑器:zend studio 10.0为例,可参考以下步骤去掉button(按钮)的边框:
创新互联坚持“要么做到,要么别承诺”的工作理念,服务领域包括:成都做网站、成都网站建设、企业官网、英文网站、手机端网站、网站推广等服务,满足客户于互联网时代的黄埔网站设计、移动媒体设计的需求,帮助企业找到有效的互联网解决方案。努力成为您成熟可靠的网络建设合作伙伴!
1、新建一个html文件,命名为test.html,用于讲解。
2、在test.html文件内,使用button标签创建一个按钮,用于测试。
3、在test.html文件内,给button按钮添加一个id属性,用于样式的设置。
4、在test.html文件内,编写style type="text/css"/style标签,页面的css样式将写在该标签内。
5、在css标签中,通过id设置button的样式,定义其背景颜色为蓝色,文字颜色为白色,最后,将border属性设置为none,实现去掉button的边框。
6、在浏览器打开test.html文件,查看实现的效果。
写网页的时候CSS样式一般是先把没用的清楚掉的,比如自带的边框 margin padding等等,
你需要把所有的标签基本都得清除一遍,不然后期写网页的时候有的小细节问题很难排查出来
取消CSS样式可以在 层或者表格代码中 找到类似class="" 或者 id="" 之类,将其删除即可。
或者在网页代码中找到 类似这样的代码
link href="css/css.css" rel="stylesheet" type="text/css" /
或者
style type="text/css"
.......
/style
将其删除即可。
方法和详细的操作步骤如下:
1、第一步,打开软件并创建一些默认复选框,见下图,转到下面的步骤。
2、第二步,执行完上面的操作之后,在顶部样式标签上设置输入样式,将输入的显示属性设置为none,删除默认的单选框,然后设置每个单选框的边距,见下图,转到下面的步骤。
3、第三步,执行完上面的操作之后,继续设置下面的样式,设置“label”标签的伪元素before和after,然后将原始复选框更改为状态属性,“
checked + label”设置为红色的实心框,并取消选中状态,“ label :: after”为白色空心框,见下图,转到下面的步骤。
4、第四步,执行完上面的操作之后,打开浏览器,可以看到设置的样式,去掉了默认样式,见下图。这样,就解决了这个问题了。
因为各个浏览器默认的样式不同,你这种情况可以使用下面代码清除边距
style*{margin:0;padding:0;}/style建议做网站的时候,设置个reset.css样式表清除各个浏览器的默认样式,已达到做的网页在各个浏览器中达到统一,下面把YUI
Reset
CSS代码贴出
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img {
border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}
在div里给它加上一个类,给新加的类写样式。
在CSS中,继承是一种非常自然的行为,我们甚至不需要考虑是否能够这样去做,但是继承也有其局限性。
首先,有些属性是不能继承的。这没有任何原因,只是因为它就是这么设置的。举个例子来说:border属性,大家都知道,border属性是用来设置元素的边框的,它就没有继承性。如下图所示,如果继承了边框属性,那么文档看起来就会很奇怪,除非采取另外的措施关掉边框的继承属性。
多数边框类属性,比如象Padding(补白),Margin(边界),背景和边框的属性都是不能继承的。
扩展资料
CSS中的样式覆盖原则:
规则一:由于继承而发生样式冲突时,最近祖先获胜(最近原则)。
strong分别从body和p中继承了color属性,但是由于p在继承树上离strong更近,因此strong中的文字最终继承p的蓝色。
规则二:继承的样式和直接指定的样式冲突时,直接指定的样式获胜(最直接原则)。
strong {color:red;}
那么根据规则二,strong中的文字最终显示为红色。
规则三:直接指定的样式发生冲突时,样式权值高者获胜。
样式的权值取决于样式的选择器,权值定义如下表。
css选择器 权值
标签选择器 1
类选择器 10
ID选择器 100
内联样式 1000
伪元素(:first-child等) 1
伪类(:link等) 10
可以看到,内联样式的权值ID选择器类选择器标签选择器,除此以外,后代选择器的权值为每项权值之和,比如”#nav .current a”的权值为100 + 10 + 1 = 111。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流