#HTML div dl dd and dt tags | Explore Tumblr posts and blogs

passo-html · 7 years ago

Text

MASTER DICIONÁRIO HTML

Tags estruturais

<!– –>

Cria um comentário

Envolve todo um documento html

Envolve o cabeçalho de um documento html

<meta>

Fornece informações gerais sobre o documento

Informações de estilo

Linguagem script

Conteúdo alternativo para quando a linguagem script não for suportada

O título do documento

Envolve o corpo (texto e tags) do documento html

bgcolor – Cor de fundo #RRGGBB

background – Imagem como plano de fundo

text – Cor do texto principal

link – Cor dos links existentes na página

vlink – Cor do link já visitado

alink – Cor do link que foi ativado

marginheight – Elimina a margem esquerda apenas no Netscape

marginwidth – Elimina a margem no topo da página apenas no Netscape

topmargin – Elimina a margem no topo da página apenas no Internet Explorer

leftmargin – Elimina a margem esquerda apenas no Internet Explorer

Cabeçalhos

Cabeçalho nível n para n de 1 a 6

Parágrafos

Um simples páragrafo

align – Alinhamento do parágrafo: left, right, center e justify

Links

Cria um link e inclui atributos em comum

href – O URL do documento que será vinculado a este. Para e-mail: mailto e link externo: http

name – O nome da âncora

target – Identifica a janela ou local em que o link deverá ser aberto: blank, self, top, parent

rel – Define os tipos de link que avançam

rev – Define os tipos de link que revertem a ação

acesskey – Atribui uma tecla de atalho para este elemento

shape – Para uso com formas de objeto

coords – Para uso com formas de objeto

tabindex – Determina a ordem das guias

onclick – É um evento JavaScript

onmouseover – É um evento JavaScript

onmouseout – É um evento JavaScript

Listas

Uma lista ordenada

start – Define a partir de qual número a listagem começa

type – Tipos de caracteres ordenados: A, a, I, i, 1

Uma lista não ordenada

type – Tipos de caracteres não ordenados: disk, square, circle

Um item da lista

value – Numeração individual do item da lista

type – Tipos de caracteres ordenados: A, a, I, i e 1 para listagem ordenada e disk, square e circle para não ordenada

Um menu com uma lista de itens

Uma listagem de diretórios

Uma lista de definições ou glossário

Marca o texto especificado como um termo de definição de um glossário

Especifica o texto referente a um termo criado pela tag <dt> dentro de uma lista de definição

Formatação de caracteres

Maior ênfase em itálico

Maior ênfase em negrito

Amostra de código

Texto a ser digitado

Uma variável ou espaço reservado para um outro valor

Texto de amostra

Aplica um formatação no texto definido como termo de um glossário

Uma citação

Texto em negrito

Texto em itálico

Texto sublinhado

Fonte monoespaçada (texto semelhante à maquina de escrever)

Texto pré-formatado

Texto riscado

Texto tachado

Texto subscrito

Texto sobrescrito

Texto em fonte maior do que o padrão

Texto em fonte menor do que o padrão

Texto piscando somente no Nestcape

Texto animado no Internet Explorer

Outros elementos

<hr>

Uma régua horizontal

size – Espessura da linha em pixels

width – Largura da linha em pixels ou porcentagem

align – Alinhamento da linha em center, left, right

color – Cor da linha em #RRGGBB

noshade – Linha sólida

<br>

Uma quebra de linha

Centralizar

Conteúdo

align – Alinhamento: left, center e right

Texto com mais margem

Assinaturas ou informações gerais sobre o autor de um documento

Alterna tamanho , cor e tipo de fonte exibida

size – O tamanho da fonte varia de 1 a 7

color – A cor da fonte #RRGGBB

face – O tipo da fonte

Define o tamanho padrão para a fonte na página atual

size – O tamanho da fonte varia de 1 a 7

Imagens

<img>

Insere uma imagem in-line no documento e inclui atributos comuns

usemap – Um mapa de imagens do lado cliente

src – O URL da imagem

alt – Uma string de texto que será exibida em navegadores que não possam suportar imagens

align – Determina o alinhamento de uma determinada imagem: top, middle, bottom, left e right

height – É a altura sugerida em pixels

width – É a extensão sugerida em pixels

vspace – O espaço entre a imagem e o texto acima e abaixo dela

hspace – O espaço entre a imagem e o texto à esquerda e à direita dela

border – Largura da borda

Tabelas

Cria uma tabela

background – Imagem de plano de fundo

bgcolor – Cor de plano de fundo

border – Largura da borda em pixels

cols – Número de colunas

cellpadding – Espaçamento nas células

cellspacing – Espaçamento entre as células

width – Largura da tabela

align – Alinhamento da tabela: left, center, right

bordercolor – Cor na borda da tabela

A legenda para a tabela

Uma linha na tabela

align – O alinhamento horizontal do conteúdo das células dentro dessa linha com os valores possíveis left, right, center, justify e char

bgcolor – Cor de fundo

valign – o alinhamento vertical do conteúdo das células dentro dessa linha com os valores possíveis top, middle, bottom e baseline

background – Figura como plano de fundo

Um cabeçalho de célula da tabela

align – Alinhamento horizontal

valign – Alinhamento vertical

bgcolor – Cor de plano de fundo

rowspan – O número de linhas pelo qual essa célula se expandirá

colspan – O número de colunas pelo qual essa célula se expandirá

nowrap – Desliga o enquadramento de texto em uma célula

Define uma célula de dados da tabela

align – Alinhamento horizontal

valign – Alinhamento vertical

bgcolor – Cor de plano de fundo

rowspan – O número de linhas pelo qual essa célula se expandirá

colspan – O número de colunas pelo qual essa célula se expandirá

nowrap – Desliga o enquadramento de texto em uma célula

width – Largura da célula

height – Altura da célula

Formulários

Define um formulário

action – Responsável por determinar o exato local para onde as informações coletadas no formulário deverão ser enviadas

method – Método de empacotamento dos dados do formulário: get, post e enctype="multipart/form-data"

name – Nome do objeto

<input>

Caixa de texto

type – Tipo de dado: text, file, radio, checkbox, hidden, password, submit, reset, button, image

name – Identificação do campo

size – Largura

maxlength – Número máximo de caracteres permitidos

value – Texto que aparece dentro da caixa ou nome do botão

checked value – Valor assumido quando este campo for selecionado

Permite criar elementos de entrada com características de texto

rows – Tamanho da linha da caixa de texto

cols – Tamanho da coluna da caixa de texto

name – Identificação do campo

wrap – Quebra de linha da caixa de texto: off, virtual, physical

Seleção

name – Identificador

Opção

value – Valor do campo

Se te foi útil, por favor, dê like ou reblog. /Gabi

Créditos: Codigofonte.

#dicionário html #master dicionario html #html #tabs #principais tags de thml #tags html

79 notes · View notes

yyq123 · 5 years ago

Text

VIM学习笔记网页开发-输入网页标签(Input HTML Tags)

在编写HTML代码时，重复录入标签显然是相当低效的。我制作了HTML-Editor插件，通过快捷键和菜单项来提高输入HTML标签的效率。

安装配置插件

请在vimrc中添加以下命令，以便在“Insert (paste)”状态下正常使用快捷键：

:set nopaste

如果侦测文件类型为XHTML，那么将自动使用小写的标签。��可以定义以下变量，以强制使用小写标签：

:let g:do_xhtml_mappings = 'yes'

在插入模式下，输入以“;”开头的关键词，比如“;pp”，将自动扩展为完整的段落标签；使用以下命令，可以修改默认的前缀键为逗号：

:let g:html_map_leader = ','

假设使用;ah快捷键，输入以下链接标签。光标将自动定位到href属性的引号之内；输入链接地址之后，点击Tab键将移动至title属性的引号之内；输入链接标题之后，点击Tab键将移动至</a>标签之前。也就是说，使用Tab键可以快速跳转至下一标签属性，进一步提高输入HTML代码的效率。

如果您需要输入真正的Tab制表符，那么可以使用;Tab快捷键。

如果您希望恢复通常的Tab键操作行为，那么请设置以下变量：

let g:no_html_tab_mapping = 'yes'

利用快捷键输入标签

以下表格列示了在插入模式和可视化模式下，用于输入HTML标签的快捷键：

快捷键输入代码;;插入字符“;”;&插入字符“&”[1];4<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://ift.tt/kTyqzh"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://ift.tt/kkyg93">;s4<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://ift.tt/nYkKzf"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "https://ift.tt/mOIMeg">;ab<abbr title=""></abbr>;ad<address></address>;ah<a href="" title=""></a>;an<a id=""></a>;bd <body><CR></body>;bh<base href="" />;bl<blockquote><CR></blockquote>;br<br />;bu<input type="button" name="" value="" />;ca<caption></caption>;ch<input type="checkbox" name="" value="" />;ci<cite></cite>;cm;co<code></code>;cs<style type="text/css"></style>;ct<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> [2];dd<dd></dd>;de<del></del>;df<dfn></dfn>;dl<dl><CR></dl>;dt<dt></dt>;dv<div><CR></div>;eb<embed type="" src="" width="" height="" />;em<em></em>;fi<input type="file" name="" value="" size="20" />;fm<form action=""><CR></form>;h1<h1></h1>;h2<h2></h2>;h3<h3></h3>;h4<h4></h4>;h5<h5></h5>;h6<h6></h6>;he<head><CR></head>;hi<input type="hidden" name="" value="" />;hr<hr />;ht<html xmlns="https://ift.tt/3b8LcZy>;if<iframe src=""><CR></iframe>;im<img src="" alt="" />;in<ins></ins>;it<i></i>;js<script type="text/javascript"></script>;la<label for=""></label>;li<li></li>;lk<link href="" />;ls<link rel="stylesheet" type="text/css" href="" />;me<meta name="" content="" />;mh<meta http-equiv="" content="" />;mi<img src="" width="" height="" alt="" /> [3];ms<select name="" multiple><CR></select>;ns<noscript><CR></noscript>;ob<object data="" width="" height=""><CR></object>;og<optgroup label=""><CR></optgroup>;ol<ol><CR></ol>;op<option></option>;pa<input type="password" name="" value="" size="20" />;pm<param name="" value="" />;pp<p></p>;pr<pre><CR></pre>;qu<q></q>;ra<input type="radio" name="" value="" />;re<input type="reset" value="Reset" />;sa<samp></samp>;sb<sub></sub>;se<select name=""><CR></select>;sj<script src="" type="text/javascript"></script>;sm<small></small>;sn<span></span>;sp<sup></sup>;st<strong></strong>;su<input type="submit" value="Submit" />;ta<table><CR></table>;tA在可视化模式下，提示输入行列数，并自动生成表格代码;tb<tbody><CR></tbody>;td<td></td>;te<input type="text" name="" value="" size="20" />;tf<tfoot><CR></tfoot>;th<th></th>;tH<thead><CR></thead>;ti<title></title>;tr<tr></tr>;tx<textarea name="" rows="10" cols="50"><CR></textarea>;ul<ul><CR></ul>

请注意：

由于“&”作为前缀键用于输入字符实体(Character Entity)，所以定义快捷键用来输入此特殊字符；

charset属性根据文件的'fileencoding'或'encoding'属性自动判断；您也可以通过g:html_default_charset变量进行强制定义；

点击;mi将查找src指定的图片文件，然后将获得的图片尺寸信息更新到width和height属性中；

代码列中的“<CR>”，代表换行符；

在可视化模式下选则文本然后点击快捷键，将插入标签并将选中的文本放置在name、value或content属性中；

对于<acronym>,<big>,<center>,<font>,<isindex>,<strike>,<tt>,<frame>,<frameset>,<noframes>,<b>,<u>等等已废弃的标签，不建议继续使用；

关于完整的HTML标签索引，请参考HTML Elements Index。

利用菜单输入标签

您也可以使用“HTML”菜单来输入HTML标签；

Ver: 2.0 | YYQ<上一篇 | 目录 | 下一篇>

from Blogger https://ift.tt/2RS5rDl via IFTTT

#IFTTT #Blogger

0 notes

ysuiid · 7 years ago

Text

BASICS OF HTML / CHEATSHEET

Some of the most basic HTML you will use up-front will look a bit like this:

Basic Tags

<html></html> Creates an HTML document

<head></head> Sets off the title and other information that isn’t displayed on the web page itself

<body></body> Sets off the visible portion of the document

HTML Basic Document

<!DOCTYPE html> <html> <head> <title>Title of document goes here</title> </head>

<body> Visible text goes here... </body>

</html>

Basic Tags

<h1>Largest Heading</h1>

<h6>Smallest Heading</h6>

<p>This is a paragraph.</p>

<br> (line break)

<hr> (horizontal rule)

Body Attributes

<body bgcolor="pink"> Sets the background color, using name or hex value

<body text="black"> Sets the text color, using name or hex value

<body link="blue"> Sets the color of links, using name or hex value

<body vlink="#ff0000"> Sets the color of followed links, using name or hex value

<body alink="#00ff00"> Sets the color of links on click

<body ondragstart="return false" onselectstart="return false"> Disallows text selection with the mouse and keyboard

Text Tags

<pre></pre> Creates preformatted text

<hl></hl> Creates the largest headline

<h6></h6> Creates the smallest headline

<b></b> Creates bold text

<i></i> Creates italic text

<tt></tt> Creates teletype, or typewriter-style text

<cite></cite> Creates a citation, usually italic

<em></em> Emphasizes a word (with italic or bold)

<strong></strong> Emphasizes a word (with italic or bold)

<font size="3"></font> Sets size of font, from 1 to 7

<font color="green"></font> Sets font color, using name or hex value

<code>Computer code</code>

<em>Emphasized text</em>

<i>Italic text</i>

<kbd>Keyboard input</kbd>

<pre>Preformatted text</pre>

<small>Smaller text</small>

<strong>Important text</strong>

<abbr> (abbreviation)

<address> (contact information)

<bdo> (text direction)

<blockquote> (a section quoted from another source)

<cite> (title of a work)

<del> (deleted text)

<ins> (inserted text)

<sub> (subscripted text)

<sup> (superscripted text)

Links

<a href="URL"></a> Creates a hyperlink

<a href="mailto:EMAIL"></a> Creates a mailto link

<a href="URL"><img src="URL"> </a> Creates an image/link

<a name="NAME"></a> Creates a target location within a document

<a href="#NAME"></a> Links to that target location from elsewhere in the document

Ordinary link: <a href="http://www.example.com/">Link-text goes here</a>

Image-link: <a href="http://www.example.com/"><img src="URL" alt="Alternate Text"></a>

Mailto link: <a href="mailto:[email protected]">Send e-mail</a>

Bookmark: <a id="tips">Tips Section</a> <a href="#tips">Jump to the Tips Section</a>

Images

Styles/Sections

<div>A block-level section in a document</div> <span>An inline section in a document</span>

Unordered list

Ordered list

<ol> <li>First item</li> <li>Second item</li> </ol>

Definition list

<dl> <dt>Item 1</dt> <dd>Describe item 1</dd> <dt>Item 2</dt> <dd>Describe item 2</dd> </dl>

Tables

<table border="1"> <tr> <th>table header</th> <th>table header</th> </tr> <tr> <td>table data</td> <td>table data</td> </tr> </table>

Formatting

<p></p> Creates a new paragraph

<p align="left"> Aligns a paragraph to the left (default), right, or center.

<br> Inserts a line break

<blockquote></blockquote> Indents text from both sides

<dl></dl> Creates a definition list

<dt> Precedes each definition term

<dd> Precedes each definition

<ol></ol> Creates a numbered list

<ul></ul> Creates a bulleted list

<li></li> Precedes each list item, and adds a number or symbol depending upon the type of list selected

<div align="left"> A generic tag used to format large blocks of HTML, also used for stylesheets

<img src="name"> Adds an image

<img src="name" align="left"> Aligns an image: left, right, center; bottom, top, middle

<img src="name" border="1"> Sets size of border around an image

<hr /> Inserts a horizontal rule

<hr size="3" /> Sets size (height) of rule

<hr width="80%" /> Sets width of rule, in percentage or absolute value

<hr noshade /> Creates a rule without a shadow

Tables

<table></table> Creates a table

<tr></tr> Sets off each row in a table

<td></td> Sets off each cell in a row

<th></th> Sets off the table header (a normal cell with bold, centered text)

Table Attributes

<table border="1"> Sets width of border around table cells

<table cellspacing="1"> Sets amount of space between table cells

<table cellpadding="1"> Sets amount of space between a cell’s border and its contents

<table width="500" or "80%"> Sets width of table, in pixels or as a percentage of document width

<tr align="left"> or <td align="left"> Sets alignment for cell(s) (left, center, or right)

<tr valign="top"> or <td valign="top"> Sets vertical alignment for cell(s) (top, middle, or bottom)

<td colspan="2"> Sets number of columns a cell should span (default=1)

<td rowspan="4"> Sets number of rows a cell should span (default=1)

<td nowrap> Prevents the lines within a cell from being broken to fit

Cheatsheets:

http://www.webmonkey.com/2010/02/html_cheatsheet/ http://www.w3schools.com/html/html_quick.asp http://www.simplehtmlguide.com/cheatsheet.php http://www.instructables.com/id/Basic-HTML-code-cheat-sheet/

0 notes

captainlenfan · 6 years ago

Text

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

New Post has been published on https://fitnesstech.website/product/folding-x-shape-3-in-1-workout-exercise-bike-8-level-magnetic-resistance-fitness/

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

listing template .pcTemplate display:none; .mobileTemplatedisplay:block; <p>@media only screen and (min-width:960px) .pcTemplatedisplay:block; .mobileTemplatedisplay:none;

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td margin:0; padding:0; body background:#fff; color:#555; font-size:12px; font-family: Verdana, Arial, Helvetica, sans-serif; td,th,caption font-size:12px; h1, h2, h3, h4, h5, h6 font-weight:normal; font-size:100%; address, caption, cite, code, dfn, em, strong, th, var font-style:normal; font-weight:normal; a color:#555; text-decoration:none; a:hover text-decoration:underline; img border:none; ol,ul,li list-style:none; input, textarea, select, button font:14px Verdana,Helvetica,Arial,sans-serif; table border-collapse:collapse; html /* css common */ .clearfix:after content: "."; display: block; height:0; clear:both; visibility: hidden; .clearfix *zoom:1; <p>.flfloat:left; .frfloat:right; /*上面为css初始化*/ .containerwidth:1362px; <p>headerheight:85px;padding-top:50px;background-color:#fff; .logowidth:256px;height:83px;background:url(https://s3.amazonaws.com/EbayTemplate/etech/2018listing/logo.png) no-repeat; <p>.top_navpadding-top:15px; .top_nav lifloat:left; .top_nav li afloat:left;margin-right:10px;display:inline-block;background-color:#593713;color:#fff; width:175px;height:38px;line-height:38px;text-align:center;font-size:12px; <p>.icon_visitdisplay:inline-block;width:23px;height:22px;position:relative;background:url(https://s3.amazonaws.com/EbayTemplate/TEST/icon1.png) no-repeat;top: 5px;left: -10px; .icon_emaildisplay:inline-block;width:24px;height:15px;position:relative;background:url(https://s3.amazonaws.com/EbayTemplate/TEST/icon2.png) no-repeat;top: 3px;left: -8px; <p>/*banner*/ .bannerwidth:100%; .banner imgwidth:100%;height:320px;display:inline-block; <p>/*bigpic*/ .bigpicpadding:20px 0; .bigpic_descri pwidth:97%;color:#000;line-height:200%; .bigpic_descri spanline-height:150% !important; .bigpic_descri strongfont-weight: bold !important; <p>.bigpic_descriwidth:50%; .bigpic_descri h2color:#593713;font-size:25px;margin-bottom: 20px; .bigpic_descri h2 spanline-height:120%; .bigpic_descri .conmin-height:400px;padding:30px 10px;line-height: 26px;text-align: justify;overflow:hidden; .bigpic_descri .con imgwidth:100%; <p>#publishDescriptioncolor:#000; line-height:18px; #publishDescription img border: 0 none; height: auto; max-width: 100%; <p>/*轮播图*/ .slider width: 662px; position: relative; float:left; padding-top:672px; <p> <p>.slider>img position: absolute; left: 0; top: 0; /*transition: all 0.5s;*/ <p>.slider input[name='slide_switch'] display: none; <p>.slider label <p> float: left; cursor: pointer; /*transition: all 0.5s;*/ <p> /*Default style = low opacity*/ opacity: 1; <p>.slider label img display: block; width:158px;height:158px;margin-right:7px;margin-bottom:10px;border:1px solid #b5b5b5; <p> <p>.slider input[name='slide_switch']:checked+label <p> opacity: 1; <p>.slider input[name='slide_switch'] ~ img opacity: 0; /*transform: scale(1.1);*/ width:660px; height:660px; border:1px solid #b5b5b5; <p>.slider input[name='slide_switch']:checked+label+img opacity: 1; transform: scale(1); <p>/*item这块*/ .index_itemposition:relative; .index_more adisplay:inline-block;position:absolute;right:0;top:5px;color:#593713;font-size:20px; .index_item h2width:100%;height:40px;line-height:40px;color:#593713;font-size:20px; <p>.index_item_listpadding: 20px 0; .index_item_list li adisplay:inline-block;float:left;width:15%;margin-right:27px; .index_item_list li a:hovertext-decoration:none;background-color:#fcfcfc; .index_item_list li a:hover imgopacity:0.8; .index_item_list li:last-child amargin-right:0; .index_item_list li a imgdisplay: inline-block;width:200px;height:200px; .index_item_list pwidth:100%;padding:10px 0;line-height:20px;max-height:60px;overflow:hidden;text-align: left;font-size:12px;word-wrap:break-word;-webkit-word-wrap:break-word; .index_item_list span.index_pricedisplay:block;width:100%;text-align:left;font-size:18px;color:#593713;cursor:auto; /*选项卡*/ .edesc width:1000px; margin: 0 auto;padding-bottom:40px; .infobar position:relative;min-height:600px; .infobar li background:#2a2a2a;height:32px; line-height:32px; color:#fcfcfc; float:left; text-align:center; <p>.infobarbody color:#222222; position:absolute; width:1000px; left:0px; top:40px; display:none; line-height:120%; <p>.infobar li.first_con .infobarbody display:block; .infobar li.con2:hover .infobarbody display:block; .infobar li.con2:hover .con1display:none !important; .infobarbody p margin-bottom:8px; <p>.edesc width:100%; .infobarbody width:97%;padding:20px;height:600px;top:40px;font-size:14px;background-color:#fff;text-align:left; <p>.bottom-infolayout width: 100%; <p>.ehot-tags margin: 0 50px; .infobarwidth:100%; .infobar li width:20%;background-color:#d1c0a6;color:#fff;margin-right:0;height:40px;line-height:40px;font-size:14px; <p>.infobar li:hoverbackground-color:#593713; <p>/*footer*/ .footerposition:relative;width:100%;background-color:#593713;height:40px;margin-top:30px; .footer_mwidth:100%;padding-top:10px; .footer_m pwidth:100%;text-align: center;color:#fff;font-size:12px;line-height:20px; .footer_m p acolor:#fff;font-size:12px; <p>/*适配小屏幕*/ @media(max-width:1150px) .containerwidth:1100px; .bigpic_descriwidth:40%; .index_item_list li amargin-right:18px; .index_item_list li a imgwidth:180px;height:180px; /*bigpic*/ <p>.bigpic_descriwidth:33%; .bigpic_descri h2color:#d1c0a6;font-size:25px; .bigpic_descri .conmin-height:350px; .infobarbody width:96%; <p>

VISIT OUR STORE

SIGH UP FOR EMAIL

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

Features: 1. Premium 3-in-1 ways to switch upright/semi-recumbent/recumbent type 2. It has resistance bands both for arm and leg, You can have stretching exercises after cycling workout 3. Comfortable seat with high backerst 4. Hand pulse handle with pre-assembled exercise monitor 5. High-end curved crank arm with anti-slip pedal with soft shoe strap makes the pedaling training safe 6. 8 level magnetic resistance Specifications: 1. Material: Plastic & ABS & Steel 2. Color: Black/Pink/Red 3. Dimensionss: (30.7 x 5.5 x 45.7)” / (78 x 41 x 116)cm (L x W x H) 4. Weight: 45.2lbs / 20.5kg 5. Weight Capacity: 300lbs / 136kg 6. Magnetic Resistance Level: 8 7. Foldable: Yes 8. Hand Pulse: Yes 9. Model: CF-917FM 10. Suitable for: Home Use

Package Includes: 1 x Folding Exercise Bike

You might like this

more>>

Wireless 720P HD PTZ Security CCTV IP Camera

$20.49

Outdoor Amplified HD TV Antenna High Gain 36dB

$23.59

Handgunc Carrying Case Digit Password Lock Safe Tool Box

$21.49

Display Storage Containers Holder Organizer

$14.99

18oz A/C Air Conditioner System Flush Canister Gun Kit

$27.99

5 Holder Folding Organizer Rack Stage Bass Acoustic Electric

$19.99

Shipping Policy

1. Ship worldwide from New Jersey by reliable shipping companies — USPS, UPS, FEDEX, DHL, etc., and only to VERIFIED PAYPAL ADDRESS. Transport Delivery ETA. Package handling only takes 1 business day at our warehouse, so please make sure entering correct payment and shipping information before checking out. Once your payment is completed, we are not going to accept any more changes to your order.

2. International Buyers – Please Note:

a. Import duties, taxes and charges are not included in the item price or shipping charges. These charges are the buyer’s responsibility.

b. Please check with your country’s customs office to determine what these additional costs will be prior to bidding/buying.

3. Please check your shipping address carefully before checkout, it can’t be changed if order completed.

4. Orders placed on weekend will be shipped within 2 days.Notification of shipment with tracking number will be sent to buyers.

5. Standard shipping: 2-7 business days Expedited Shipping: 2-3 business days One-day Shipping: 1 business day International shipping: Varies

6.Ship within 1 business day once payment completed. Notification of shipment with tracking No. will be sent to buyer.

7.We offer discounts for combine shipping. Please contact us first if you need combine shipping, and an invoice with discount will be sent to you.

8.Please allow 5 business days for delivery to US destinations on any eBay orders and 14 business days for delivery to any International destinations. We highly recommend our buyer choose priority/expess mail for international delivery which is much more stable.

Return Policies

1. Refunds given only if item DOA and cannot be replaced via PAYPAL . If so, Please contact us with 5 days since you receive the item and and return to us within 30 days from the delivery date for exchange or refund.

2. If you need return, please contact our customer service representative, let us know the detailed problem and send us some pictures for confirmation.

Payment

Payment should be sent within 8(EIGHT) days of auction closing.

Feedback

If you are dissatisfied for any reason, please do not be quick to leave negative/neutral feedback. We work hard to make sure EVERY CUSTOMER 100% SATISFIED and resolve any problem for you.

Work Time

Work Time:Monday to Saturday

无标题文档 *margin:0;padding:0;font-family: arial,"microsoft yahei"; htmlfont-size:10px; lilist-style:none; <p>li list-style-type:none; <p>/**/ @media screen and (min-width: 320px) htmlfont-size:50px; @media screen and (min-width: 360px) htmlfont-size:56.25px; @media screen and (min-width: 375px) htmlfont-size:58.59375px; @media screen and (min-width: 400px) htmlfont-size:62.5px; @media screen and (min-width: 414px) htmlfont-size:64.6875px; @media screen and (min-width: 440px) htmlfont-size:68.75px; @media screen and (min-width: 480px) htmlfont-size:75px; @media screen and (min-width: 520px) htmlfont-size:81.25px; @media screen and (min-width: 560px) htmlfont-size:87.5px; @media screen and (min-width: 600px) htmlfont-size:93.75px; @media screen and (min-width: 640px) htmlfont-size:100px; @media screen and (min-width: 680px) htmlfont-size:106.25px; @media screen and (min-width: 720px) htmlfont-size:112.5px; @media screen and (min-width: 760px) htmlfont-size:118.75px; @media screen and (min-width: 800px) htmlfont-size:100px; @media screen and (min-width: 960px) htmlfont-size:100px; .clearfix:after visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; .m_containermax-width:7rem;margin:0 auto; <p>#publishDescription1padding:20px; #publishDescription1 img border: 0 none; height: auto; max-width: 100%; .test width: 100%; height: auto; margin: 10px 0; overflow: hidden; .test input[type="radio"] display: none; .test label position: relative; width: 100%; height: 38px; line-height: 38px; font-size:16px; background: #666; color: #fff; float: left; border-top: 1px solid #fff; cursor: pointer; text-indent: 8px; .test input[type="radio"]+span display: none; width: 100%; line-height: 22px; color: #000; cursor: default; padding:15px 30px; border: 1px solid #bbb; box-sizing: border-box; text-decoration: none; font-size:14px; .test input[type="radio"]:checked+span display: inline-block; .m_bannerwidth:100%;height:100px;margin-bottom:15px;background:darkorange;cursor: pointer; .product_txtwidth:100%;line-height:0.4rem;background:#666666;color:#fff;font-size:0.26rem;text-align: center; <p>.m_slider width:100%; position: relative; margin-bottom:0.3rem; padding-top:7.5rem; <p> <p>#publishDescription1 p,#publishDescription1 spancolor:#000;line-height:130%; #publishDescription1 strongfont-weight: bold; .m_bigpic position: absolute; left: 0; top: 0; transition: all 0.5s; <p>.m_slider input[name='m_slide_switch'] display: none; <p>.m_slider label <p> width:17%; float: left; cursor: pointer; /*transition: all 0.5s;*/ margin: 0.1rem 0.08rem; /*Default style = low opacity*/ opacity:1; <p>.m_slider label img display: block; width:1.2rem;height:1.2rem;border:1px solid #d5d5d5;display:inline-block; <p> <p>.m_slider input[name='m_slide_switch']:checked+label border-color: #666; opacity: 1; <p>.m_bigpic opacity: 0; /*transform: scale(1.1);*/ width:100%; <p> .first-picopacity:1; .m_slider input[name='m_slide_switch']:checked+label+img opacity: 1; transform: scale(1);

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

Package Includes: 1 x Folding Exercise Bike

Shipping + 1. Ship worldwide from New Jersey by reliable shipping companies — USPS, UPS, FEDEX, DHL, etc., and only to VERIFIED PAYPAL ADDRESS. Transport Delivery ETA. Package handling only takes 1 business day at our warehouse, so please make sure entering correct payment and shipping information before checking out. Once your payment is completed, we are not going to accept any more changes to your order. 2. International Buyers – Please Note: a. Import duties, taxes and charges are not included in the item price or shipping charges. These charges are the buyer’s responsibility. b. Please check with your country’s customs office to determine what these additional costs will be prior to bidding/buying. 3. Please check your shipping address carefully before checkout, it can’t be changed if order completed. 4. Orders placed on weekend will be shipped within 2 days.Notification of shipment with tracking number will be sent to buyers. 5. Standard shipping: 2-7 business days Expedited Shipping: 2-3 business days One-day Shipping: 1 business day International shipping: Varies 6.Ship within 1 business day once payment completed. Notification of shipment with tracking No. will be sent to buyer. 7.We offer discounts for combine shipping. Please contact us first if you need combine shipping, and an invoice with discount will be sent to you. 8.Please allow 5 business days for delivery to US destinations on any eBay orders and 14 business days for delivery to any International destinations. We highly recommend our buyer choose priority/expess mail for international delivery which is much more stable. Payment + Payment should be sent within 8(EIGHT) days of auction closing. Returns + 1. Refunds given only if item DOA and cannot be replaced via PAYPAL . If so, Please contact us with 5 days since you receive the item and and return to us within 30 days from the delivery date for exchange or refund. 2. If you need return, please contact our customer service representative, let us know the detailed problem and send us some pictures for confirmation. Feedback + If you are dissatisfied for any reason, please donot be quick to leave negative/neutral feedback. We work hard to make sure EVERY CUSTOMER 100% SATISFIED and resolve any problem for you and always leave positive feedback to all our customers. Contact us + Work Time:Monday to Saturday Reply + All replies will be sent to your email box, if you don’t get response within 24 hours (Sat. & Sun. excluded) please check your eBay My Messages in case that our emails will be filtered automatically by your settings.

0 notes

bkcomputercafe · 7 years ago

Text

All HTML Tags List in Hindi

सभी HTML Tags के नाम और सूची (HTML Tags List)

HTML में सैंकडों Elements है. प्रयेक HTML Elements का अपना विशेष कार्य होता है. इसलिए ज��से-जैसे Webpages में नये-नये Functions की जरूरत पडती गई वैसे-वैसे ही New HTML Tags का Development होता गया.

इस Lesson में हमने लगभग All HTML Tags के नाम और उनके उपयोग के बारे में बताया है. हमने All HTML Tags की Complete List बनाई है. HTML Tags List को हमने कई Categories में बांटा है. ताकि HTML Tags को समझने में आसानी रहे.

Complete HTML Tags List

Basic Tags

HTML Basic Tags वे Tags होते है, जो एक HTML Document की Foundation रखते है. इसलिये इन्हे Foundation Tags भी कहते है. नीचे HTML Basic Tags की List और उनके उपयोग के बारे में बताया जा रहा है.

<–…–> – यह Comment Tag है. Comment Element का उपयोग HTML Document में Comment Define करने के लिए किया जाता है.

<!DOCTYPE> – DOCTYPE Element का पूरा नाम Document Type Definition होता है. DOCTYPE Element का उपयोग Document Type को Define करने के लिए किया जाता है.

<HTML> – HTML Element एक HTML Document का Root Element होता है. इससे HTML Document को Define किया जाता है.

<Head> – Head Element द्वारा HTML Document के बारे में लिखा जाता है. यह एक Webpage का Header Section होता है. जिसमे अधिकतर Meta Information को लिखा जाता है.

<Title> – Title Element का उपयोग HTML Document का Title Define करने के लिए किया जाता है. Document Title हमें Browser Window में दिखाई देता है. Document Title को Head Element में लिखा जाता है.

<Body> – Body Element से HTML Document की Body को Define किया जाता है. Body Element में एक HTML Document का Visible Part लिखा जाता है, जो Users को दिखाई देता है.

<H1> to <H6> – ये Heading Elements है. Heading Element द्वारा HTML Document में Headings को Define किया जाता है. HTML में H1 से H6 Level तक Headings बना सकते है.

<P> – इसे Paragraph Element कहते है. इसका उपयोग HTML Document में Paragraph Define करने के लिए किया जाता है.

<Hr> – <hr> Element का पूरा नाम Horizontal Line है. Hr Element से HTML Document में Horizontal Line को Define किया जाता है.

<Br> – <br> Element का पूरा नाम Break है. Br Element का उपयोग Single Line Break देने के लिए किया जाता है. मतलब आप एक Line को अलग-अलग Line में तोडकर लिख सकते है.

Formatting Tags

Formatting HTML Tags वे Tags होते है, जिनसे Document Text की Formatting की जाती है. मतलब आप Text को किस प्रकार दिखाना चाहते है. नीचे कुछ मुख्य Formatting Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

<abbr> – <abbr> Element का पूरा नाम Abbreviation होता है. Abbreviation Element से Abbreviation Define किया जाता है.

<b> – <b> Element का पूरा नाम Bold है. Bold Element से Text को Bold (गहरा) किया जाता है.

<big> – Big Element से Text को Normal Size से बडा करने के लिए किया जाता है.

<blockquote> – Blockquote Element का उपयोग Document में Text को Quote करने के लिए किया जाता है. इसका मुख्य उपयोग अन्य Source से प्राप्त Data को Quote करने के लिए होता है.

<center> – इसे Center Element कहते है. इससे किसी HTML Element की Center Position को Define किया जाता है.

<code> – Code Element से Computer Code को Define किया जाता है.

<del> – <del> Element का पूरा नाम Delete है. Delete Element से Document से Delete Text को Define किया जाता है.

<em> – <em> Element का पूरा नाम Emphasize होता है. इससे Text को Emphasized किया जाता है.

<font> – Font Element से Text का Font, Color और Size Define किया जाता है.

<i> – <i> Element का पूरा नाम Italic है. इससे Text को Italic यानि तिरछा किया जाता है.

<ins> – <ins> Element का पूरा नाम Insert है. Insert Element से Delete किए गए Text की जगह पर लिखे गए Text को Define किया जाता है.

<mark> – Mark Element से Text को Highlight किया जाता है.

<pre> – <pre> Element का पूरा नाम Preformat है. इस Element से Preformatted Text को Define किया जाता है.

<q> – <q> Element का पूरा नाम Quotation है. Quotation Element से छोटा Quotation Define किया जाता है. जैस; किसी शब्द या शब्दांश को Quote करने के लिए <q> Element का उपयोग किया जाता है.

<small> – Small Element से Text को Normal Size से छोटा दिखाने के लिए किया जाता है.

<strike> – <strike> Element का पूरा नाम Strikethrough है. Strikethrough Element से Strikethrough Text को Define किया जाता है. इससे Text के बीछ में एक Line आ जाती है.

<strong> – इससे Important Text को Define किया जाता है.

<sub> – <sub> Element का पूरा नाम Subscript होता है. <sub> Element से Text को Subscript किया जाता है.

<sup> – <sup< Element का पूरा नाम Suprescript है. इससे Text को Suprescript किया जाता है.

<u> – <u> Element का पूरा नाम Underline होता है. इस Element से Text को Underline किया जाता है. मतलब Text के नीचे एक Line आ जाती है.

Style Tags

Style Tags के द्वारा एक HTML Document की Style Information को Define किया जाता है. नीचे Style Tags के बारे में बताया जा रहा है.

Image Tags

Image Tags के द्वारा HTML Document में Image Insert करने के लिए किया जाता है. नीचे Image Tags के नाम और इनके उपयोग के बारे में बताया जा रहा है.

<img> – <img> Element का पूरा नाम Image होता है. इस Element द्वारा Document में Image को Define किया जाता है.

<map> – <map> Element से Image-Map को Define किया जाता है.

<area> – <area> Element से Image-Map में एक विशेष Area कोक Define किया जाता है.

Link Tags

Link Tags का उपयोग HTML Document में Hyperlinks बनाने और अन्य बाहरी Documents को जोडने के लिए किया जाता है. नीचे Link Tags का नाम और उनके उपयोग के बारे में बताया जा रहा है.

<a> – <a> Element का पूरा नाम Anchor है. Anchor Element का उपयोग Document में Hyperlink बनाने के लिए किया जाता है.

Section Tags

Section Tags का उपयोग एक HTML Document को विभिन्न भागों में विभाजित करने के लिए किया जाता है. नीचे कुछ Section Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

<span> – <span> Element के द्वारा एक HTML Document में inline Sections बनाए जाते है. इसके द्वारा एक शब्द, Paragraph, Paragraphs का एक Section बना सकते है.

<div> – <div> Element का पूरा नाम Division है. Division Element से HTML Document में अलग-अलग Sections को Define किया जाता है.

List Tags

List Tags के द्वारा HTML Document में Lists बनाई जाती है. आप Number Lists, Bullet Lists,Order Lists, Unorder Lists और Definition Lists Create कर सकते है. नीचे Lists Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

<ul> – <ul> Element का पूरा नाम Unorder List होता है. Unorder List Element द्वारा Bullet Lists या Unorder Lists बनाई जाती है.

<ol> – <ol> Element का पूरा नाम Order List होता है. Order List Element द्वारा Number या Order Lists बनाई जाती है.

<li> – <li> Element का पूरा नाम List Item होता है. List Item Element द्वारा एक List में लिखे जाने वाले Data को Define किया जाता है.

<dl> – <dl> Element का पूरा नाम Definition List होता है. Definition List Element द्वारा Definition Lists को Define किया जाता है.

<dt> – <dt> Element का पूरा ��ाम Definition Term होता है. Definition Term Element द्वारा Definition Term को Define किया जाता है.

<dd> – <dd> Element का पूरा नाम Definition Description होता है. Definition Description Element द्वारा Definition Terms के Description को Define किया जाता है.

Table Tags

Table Tags के द्वारा HTML Document में Table Create करने के लिए किया जाता है. Table से Data को Tabular Format में Present किया जाता है. नीचे Table Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

<table> – <table> Element से Table को Define किया जाता है.

<caption> – <caption> Element का उपयोग Table Caption यानि शीर्षक Define करने के लिए किया जाता है.

<th> – &th;th> Element का पूरा नाम Table Header होता है. Table Header Element द्वारा Table Header यानि Cells को Define किया जाता है.

<tr> – <tr> Element का पूरा नाम Table Row होता है. Table Row Element द्वारा Table Row को Define किया जाता है.

<td> – <td> Element का पूरा नाम Table Data होता है. Table Data Element द्वारा Table Data को Define किया जाता है. यानि जो Data हम Table में लिखना चाहता है.

<thead> – <thead> Element का पूरा नाम Table Header होता है. Table Header Element द्वारा Header Content का Group बनाया जाता है.

<tbody> – <tbody> Element का पूरा नाम Table Body होता है. Table Body Element द्वारा Table के Body Content को Group किया जाता है.

<tfoot> – <tfoot> Element का पूरा नाम Table Footer होता है. Table Footer द्वारा Footer Content को Group किया जाता है.

Forms & Input Tags

Form Tags का उपयोग एक HTML Document में अलग-अलग प्रकार के Forms बनाने के लिए किया जाता है. नीचे Form Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

<form> – <form> Element का उपयोग HTML Document में Form Create करने के लिए किया जाता है.

<input> – <input> Element का उपयोग HTML Form में विभिन्न प्रकार के Input Controls Create करने के लिए किया जाता है.

<textarea – <textarea> Element द्वारा Form में Text Area बनाया जाता है.

<button> – <button> Element से Form में Buttons बनाए जाते है.

<option> – <option> Element के द्वारा Drop-Down List में Options बनाने के लिए किया जाता है.

<optgroup> – <optgroup> Element का पूरा नाम Option Group होता है. इस Element द्वारा Drop-Down List मे एक प्रकार एक Options का एक Group बनाया जाता है.

<label> – <label> Element द्वारा एक Input Element के लिए Label को Define किया जाता है.

<fieldset> – <em> Element द्वारा Form में एक प्रकार के Elements का एक Group बनाया जाता है.

<legend> – <em> Element द्वारा Fieldset Element के लिए Caption या शीर्षक बनाया जाता है.

Scripting or Programming Tags

Scripting Tags द्वारा एक HTML Document में कुछ Programming Codes को लिखा जाता है. नीचे Scripting Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

Frame Tags

Frame Tags द्वारा एक HTML Document को कई Frames में बाँटा जा सकता है. मतलब एक Document को कई अलग-अलग Window बनाकर उनमे अलग-अलग Data Show करा सकते है. Frame का अब ज्यादा उपयोग नही किया जाता है. फिर भी जानकारी देने के लिए हमने Frame Tag के बारे में नीचे बताया है.

<frame> – <frame> Element के द्वारा HTML Document में Frames को Define किया जाता है.

<frameset> – <frameset> Element द्वारा एक Frameset को Define किया जाता है. Frameset को Frame Tag द्वारा अलग-अलग Rows और Columns में बाँटा जाता है.

<noframes> – <noframes> Element द्वारा उन ब्राउजरों एक लिए वैकल्पिक (Alternet) Content को लिखा जाता है, जो Frames को Support नही करते है.

Meta Tags

Meta Tags द्वारा एक Webpage के बारे में Information को लिखा जाता है. इस Information का उपयोग Search Engines द्वारा HTML Document के बारे में जानकारी लेने के लिए किया जाता है. नीचे मुख्य Meta Tags के नाम और उनके उपयोग के बारे में बताया जा रहा है.

<head< – <head> Element का पूरा नाम Header होता है. Header Element द्वारा एक Document के बारे में Information को Define किया जाता है.

<base> – <base> Element का उपयोग एक Document में Related URLs के लिए एक Base URL Define करने के लिए किया जाता है.

from Blogger http://bkcomputercafe.blogspot.com/2018/09/all-html-tags-list-in-hindi.html via IFTTT

#IFTTT #Blogger

0 notes

css3transitionblog-blog · 8 years ago

Text

Beautiful Breadcrumbs using css3 | Css only Breadcrumbs

Beautiful Breadcrumbs using css3 | Css only Breadcrumbs Hello friends with this article I am going to share with you a very interactive Breadcrumbs using css and css3 where I will share my some knowledge about css after and before properties and css3 border properties by which you can easily create a cross Brower compatible breadcrumbs for your website very easily. You can say these breadcrumbs css only breadcrumbs because I will use only css and css3 to make these breadcrumbs. Here you will get four breadcrumbs. Each breadcrumbs will have some additional properties threw which each will look wise different. Now I will let you know how I have created this css only breadcrumbs using css3: First of all create a html structure based on div and ul li tags. Div contains a id each id will contain different style in style sheet to present separate design. Where we are using ids crumbs1, curmbs2, crumbs3 and crumbs4. These IDs have same internal structure separated by different styles according to their ID. One Two Three Four Five One Two Three Four Five One Two Three Four Five One Two Three Four Five Now I will tell you how stylesheet structure will work for this html codes. I will start from ID #crumbs1 it will be a center aligned div taking margin from top 30px to separate each breadcrumbs having different IDs. List style will be no to avoid list black dot or other styling which is by default. Each list inline div will be list-inline to make it horizontal list using css display:list-inline. Now I will create a basic structure to make if effective breadcrumb by css #crumbs1 ul li a { display: block; float: left; height: 50px; background: #ffd928; text-align: center; padding: 30px 40px 0 80px; position: relative; margin: 0 10px 0 0; font-size: 20px; text-decoration: none; color: #fff; } It will be a simple straight list with background and padding and some other styles. After that I will create triangular structure in right side of each list anchor using css by playing with broder-properties. As you can see in code given below: #crumbs1 ul li a:after { content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #ffd928; position: absolute; right: -40px; top: 0; z-index: 1; } Same I will do with left side anchor by creating another tringle using css as code given below which will same border color as background hold. #crumbs1 ul li a:before { content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #f2f2f2; position: absolute; left: 0; top: 0; } Here this code creates tringle for both left and right side as given below: content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #f2f2f2; now we will use css code to make list first-child anchor and list last-child anchor to make it default layout so that tringle will not appear in first-child anchor for left and last-child anchor for right side. Code is given below please check it: #crumbs1 ul li:first-child a:before { display: none; } #crumbs1 ul li:last-child a:after { display: none; } As you can see in demo when we hover on breadcrumbs any list anchor it gives a effect by making it bit dark that means it is visited or hovered or we can present it effect to make it active as active breadcrumbs. For the following code as given below: #crumbs1 ul li a:hover { background: #ff9a2d; } #crumbs1 ul li a.active{ background: #ff9a2d; } #crumbs1 ul li a:hover:after { border-left-color: #ff9a2d; } #crumbs1 ul li a.active:after { border-left-color: #ff9a2d; } Here you get a details code for all please check It will be more helpful for you : CSS code for all breadcrumbs: body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote { margin: 0; padding: 0; border: 0; } body { margin: 200px; font-family: Helvetica; background: #f2f2f2; } /* Breadcrumbs 1 Css stylesheet */ #crumbs1 { text-align: center; margin-top:30px; } #crumbs1 ul { list-style: none; display: inline-table; } #crumbs1 ul li { display: inline; } #crumbs1 ul li a { display: block; float: left; height: 50px; background: #ffd928; text-align: center; padding: 30px 40px 0 80px; position: relative; margin: 0 10px 0 0; font-size: 20px; text-decoration: none; color: #fff; } #crumbs1 ul li a:after { content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #ffd928; position: absolute; right: -40px; top: 0; z-index: 1; } #crumbs1 ul li a:before { content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #f2f2f2; position: absolute; left: 0; top: 0; } #crumbs1 ul li:first-child a { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } #crumbs1 ul li:first-child a:before { display: none; } #crumbs1 ul li:last-child a { padding-right: 80px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } #crumbs1 ul li:last-child a:after { display: none; } #crumbs1 ul li a:hover { background: #ff9a2d; } #crumbs1 ul li a.active{ background: #ff9a2d; } #crumbs1 ul li a:hover:after { border-left-color: #ff9a2d; } #crumbs1 ul li a.active:after { border-left-color: #ff9a2d; } /* Breadcrumbs 1 css stylsheet Ends */ /* Breadcrumbs 2 css stylesheet starts */ #crumbs2 { text-align: center; margin-top:30px; } #crumbs2 ul { list-style: none; display: inline-table; } #crumbs2 ul li { display: inline; } #crumbs2 ul li a { display: block; float: left; height: 50px; background: #56e9ae; text-align: center; padding: 30px 40px 0 80px; position: relative; margin: 0 10px 0 0; font-size: 20px; text-decoration: none; color: #fff; } #crumbs2 ul li a:after { content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #56e9ae; position: absolute; right: -40px; top: 0; z-index: 1; } #crumbs2 ul li a:before { content: ""; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #f2f2f2; position: absolute; left: 0; top: 0; } #crumbs2 ul li:first-child a { border-top-left-radius: 0px; border-bottom-left-radius: 0px; } #crumbs2 ul li:last-child a { padding-right: 80px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } #crumbs2 ul li a:hover { background: #49c593; } #crumbs2 ul li a.active { background: #49c593; } #crumbs2 ul li a:hover:after { border-left-color: #49c593; } #crumbs2 ul li a.active:after { border-left-color: #49c593; } /* breadcrumbs 2 css stylesheet end */ /* Breadcrumbs 3 css stylesheet starts */ #crumbs3 { text-align: center; margin-top:30px; } #crumbs3 ul { list-style: none; display: inline-table; } #crumbs3 ul li { display: inline; } #crumbs3 ul li a { display: block; float: left; height: 50px; background: #ff818b; text-align: center; padding: 30px 40px 0 80px; position: relative; margin: 0 10px 0 0; font-size: 20px; text-decoration: none; color: #fff; } #crumbs3 ul li a:after { content: ""; height:80px; width:40px; border-radius:0px 40px 40px 0px; background: #ff818b; position: absolute; right: -40px; top: 0; z-index: 1; } #crumbs3 ul li a:before { content: ""; height:80px; width:40px; border-radius:0px 40px 40px 0px; background:#f2f2f2; position: absolute; left: 0; top: 0; } #crumbs3 ul li:first-child a { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } #crumbs3 ul li:first-child a:before { display: none; } #crumbs3 ul li:last-child a { padding-right: 80px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } #crumbs3 ul li:last-child a:after { display: none; } #crumbs3 ul li a:hover { background: #ea606b; } #crumbs3 ul li a.active { background: #ea606b; } #crumbs3 ul li a:hover:after { background: #ea606b; } #crumbs3 ul li a.active:after { background: #ea606b; } /* breadcrumbs 3 css stylesheet end */ /* Breadcrumbs 4 css stylesheet starts */ #crumbs4 { text-align: center; margin-top:30px; } #crumbs4 ul { list-style: none; display: inline-table; } #crumbs4 ul li { display: inline; } #crumbs4 ul li a { display: block; float: left; height: 50px; background: #2b97cc; text-align: center; padding: 30px 40px 0 80px; position: relative; margin: 0 10px 0 0; font-size: 20px; text-decoration: none; color: #fff; } #crumbs4 ul li a:after { content: ""; height:80px; width:40px; border-radius:0px 40px 40px 0px; background:#2b97cc; position: absolute; right: -40px; top: 0; z-index: 1; } #crumbs4 ul li a:before { content: ""; height:80px; width:40px; background:#f2f2f2; border-radius:0px 40px 40px 0px; position: absolute; left: 0; top: 0; } #crumbs4 ul li:first-child a { border-top-left-radius: 0px; border-bottom-left-radius: 0px; } #crumbs4 ul li:last-child a { padding-right: 80px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } #crumbs4 ul li a:hover { background: #207ca8; } #crumbs4 ul li a.active { background: #207ca8; } #crumbs4 ul li a:hover:after { background: #207ca8; } #crumbs4 ul li a.active:after { background: #207ca8; } /* breadcrumbs 4 css stylesheet end */ Demo Download Click to Post

#beautiful css breadcrumbs #Breadcrumbs #breadcrumbs using css #css only breadcrumbs

0 notes

captainlenfan · 6 years ago

Text

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

New Post has been published on https://fitnesstech.website/product/folding-x-shape-3-in-1-workout-exercise-bike-8-level-magnetic-resistance-fitness/

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

listing template .pcTemplate display:none; .mobileTemplatedisplay:block; <p>@media only screen and (min-width:960px) .pcTemplatedisplay:block; .mobileTemplatedisplay:none;

VISIT OUR STORE

SIGH UP FOR EMAIL

Folding X-Shape 3 in 1 Workout Exercise Bike 8-Level Magnetic Resistance Fitness

Package Includes: 1 x Folding Exercise Bike