【css实现标题左右横线】的更多相关文章

css实现标题左右横线

最近用到了记录一下 页面 <div class="subtitle"> 马上邀请好友得奖励 </div> 样式 .subtitle { position: relative; font-size: .24rem; color: #999999; height: 45px; line-height: 45px; text-align: center; } .subtitle:before { content: ""; position: abs…

CSS实现标题右侧“更多”

HTML < h2>< a h ref="#" >标题< /a> < span>更多…< /span> < /h2> CSS h2{ height:20px; } span{ float:right; display:block; margin:-10px 0 0 0; height:20px; } 其实只是利用了margin-top 的负数来实现,因为默认的float会换行到h2标签下面去,所以让它自个跳上去.…

CSS实现标题超出宽度省略号来表示

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>标题</title> <style type="text/css"> div{ overflow:h…

认识CSS中标题引入icon图标

前端之HTML,CSS(十一) icon图标 icon图标的使用 获取网站的中标题icon图标,以京东为例:在域名后添加/favicon.ico Enter打开 鼠标右键,图标另存为下载icon图标,默认文件名为favicon.ico,将图标存于项目文件的主目录下. 在项目中引入的方法为,在<title>标签下引入代码 <link rel="shortcut icon" type="images/x-icon" href="favicon…

HTML + CSS短标题（二，三，四文字长度）两端对齐的方式

今天切图碰到了一个看似好弄,却并不好弄的文本两端对齐问题.如图1-1…

css实现标题文字过长截取...

css实现网页中文字过长截取... title class应该这样写: .title{ width:300px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} 说明: 1.宽度一定要设置,可以根据实际需求调整. 2.white-space:nowrap是禁止文字折行. 3.text-overflow表示当文本溢出时是否显示省略标记,有两个值: clip:不显示省略标记(...),而是简单的裁切. ellipsis:当对…

CSS控制标题字符长度的方法

<style type="text/css"> .abc { background-color: #CCC; width: auto; overflow:hidden; text-overflow:ellipsis;/*文字溢出的部分隐藏并用省略号代替*/ white-space:nowrap;/*文本不自动换行*/border-radius: 5px; #四角圆 </style>…

css控制标题长度超出部分显示省略号

width: 50px; overflow:hidden;white-space:nowrap; text-overflow:ellipsis; 设置或检索是否使用一个省略标记(...)标示对象内文本的溢出. 对应的脚本特性为text-Overflow. --------------------------------------------------------------------------------- 语法:  text-overflow : clip | ellipsis  参数…

CSS控制"标题前增加小图标或编号"

---题目前加图片--- p:before { content:url(xxx/xx.png); }//所有p的最前都有一个图标 p.a:after { content:url(xxx/xx.png); }//而含有类a的p最前和最后都有一个图标 <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p class='a'>5</p> ---题目前加标号--- p:b…

CSS实现标题/段落省略效果的三剑客

white-space: nowrap;overflow:hidden;text-overflow:ellipsis; 效果如下:…