三角形的css写法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
div {
    width: 0;
    height: 0;
    border-top: 40px solid #ff0000;
    border-left: 10px solid transparent;
    border-right: 5px solid transparent;
}
</style>
</head>

<body>
<div></div>
</body>
</html>
时间: 2024-08-17 14:21:20

三角形的css写法的相关文章

优雅的css写法

一.利用好代码折叠 css也可以进行优雅的代码折叠而且会比html更好看 折叠后的效果: 这样就可以很舒服的把它折叠起来. 二.向Twitter Bootstrap学习 1. 学习的第一点就是用class,去减少id.当然这是一个很基本的知识. 2. 学习的第二点是命名的词汇. 如group.control.banner.list.item,title.panel.content.container这些表结构和关系的词汇: 还有一些形容词danger.primary.lg.xs.info等等:

webkit内核浏览器的CSS写法

-webkit-tap-highlight-color: transparent; Mobile上点击链接高亮的时候设置颜色为透明 -webkit-user-select: none; 设置为无法选择文本 -webkit-touch-callout: none; 长按时不触发系统的菜单, 可用在图片上加这个属性禁止下载图片 :-webkit-full-screen canvas {} 全屏模式时的样式(for Desktop) div p :matches(em, b, strong) {} 使

针对IE6,IE7,IE8,IE9,FF等不同浏览器的CSS写法

首先我们介绍一下HACK原理,就是不同浏览器对字符的识别不同 在 CSS中常用特殊字符识别表: (1)*: IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的; (2)!important: 除IE6不能识别 !important外, FF+IE8+IE7都能识别!important ; (3)_ : 除IE6支持_ 外, FF+IE8+IE7都不支持_; (4)\9:所有IE浏览器都识别(IE6.IE7.IE8.IE9) 示例: (1)区别FF(IE8)与IE6 IE7 back

(转载)不错的CSS写法

根据微信订阅号"设计达人"推送的文章,学到了如题知识.个人尝试了一下,感觉还不错.原文链接:http://mp.weixin.qq.com/s/g9TyBwB9xIi45TGwTBOLSQ. 字体 从用户体验角度来讲,段落文本阅读体验最好的是黑体(无衬线体),而非宋体(衬线体),Win7的时候,字体默认的宋体,而从Windows 10开始,浏览器默认字体改成微软雅黑了,而 Mac OS 默认也是黑体而非宋体. 推荐字体: Windows:MicroSoft YaHei(微软雅黑) Ma

各种demo:css实现三角形,css大小梯形,svg使用

各种demo: 1.css实现正方形 思路:width为0:height为0:使用boder-width为正方形的边长的一半,不占任何字节:border-style为固体:border-color为正方形的填充色. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css&qu

清除浮动最有效的css写法

说起来呢,基本上只要你给容器div加了float的属性,就需要清除浮动来使页面显示正常,那么,到底有什么方法可以让浮动轻松清除呢? 可以用display:flex;替代,但是它对IE8,9支持不是很好,所以不怎么这么用. 1.在容器div的里面结束标记之前写如下这样的div这段代码: <div style="clear:both"></div> 虽然通俗易懂,容易掌握,但是在页面中加入了一个无意义的空标签,违背了结构和表现分离的web标准的精髓,如果页面空标签多

html特殊字符的html,js,css写法汇总

?  箭头类 符号 UNICODE 符号 UNICODE HTML JS CSS HTML JS CSS ? &#8672 \u21E0 \21E0 ? &#8674 \u21E2 \21E2 ? &#8673 \u21E1 \21E1 ? &#8675 \u21E3 \21E3 ? &#8606 \u219E \219E ? &#8608 \u21A0 \21A0 ? &#8607 \u219F \219F ? &#8609 \u21A1

一些比较高效的CSS写法建议

当浏览器解析html的时候,它构造了一个文档树来展现所有被显示的元素. 它在特定的样式表中去匹配元素,根据标准的css的层叠,继承和顺序规则, 在mozilla的实现中(可能其他的也是这样),对于每一个元素,css引擎通过规则去寻找匹配,css引擎评估每一个规则是从右到左的,从最右的selector开始, 也称之为key selector,直到找到匹配为止. 根据这个规则,越少的规则使用,css引擎将评估的越好.因此,移除没有用的css是改善页面性能的重要一步.之后,对于页面包含很多的元素的cs

HTML特殊字符的html、js、css写法汇总 (转)

?  箭头类 符号 UNICODE 符号 UNICODE HTML JS CSS HTML JS CSS ? &#8672 \u21E0 \21E0 ? &#8674 \u21E2 \21E2 ? &#8673 \u21E1 \21E1 ? &#8675 \u21E3 \21E3 ? &#8606 \u219E \219E ? &#8608 \u21A0 \21A0 ? &#8607 \u219F \219F ? &#8609 \u21A1