Kompx.com or Compmiscellanea.com

Изображение по центру CSS

Windows : Internet Explorer 6.0+, Firefox 1.0+, Google Chrome, Opera 5.0+ [ 1 ], Safari 3.1+, SeaMonkey 1.0+ [ 2 ].

Linux : Firefox 1.0+, Google Chrome / Chromium, Opera 5.0+, SeaMonkey 1.0+ [ 3 ], NetSurf 2.6+, Hv3.

Горизонтальное выравнивание изображения по центру с помощью CSS. Пример:

Image

HTML / XHTML. Код:

<div class="example">

<img src="image.jpg" alt="Image" />

</div>

CSS. Код:

.example {position: relative; left: 0px; top: 0px; height: auto; width: 100%; float: left; padding: 10px; border: 1px #ccc solid; background: #fafafa;}

.example img {display: block; margin: 0 auto;}

CSS свойства контейнера (в данном случае example) могут быть самые разные, выравнивание изображения по центру создается с помощью стилей, непосредственно относящихся к изображению: .example img {display: block; margin: 0 auto;}.


[ 1 ]

А так же в Opera 4.0+, если не используется краткая запись CSS свойств. То есть, если код CSS в виде .example img {display: block; margin-left: auto; margin-right: auto;}.

[ 2 ]

А так же в Netscape 6.01+, Mozilla 0.6+.

[ 3 ]

А так же в Netscape 6.01+, Mozilla 0.6+.


Aliosque subditos et thema

 

Вертикальное выравнивание CSS

 

Вертикальное выравнивание CSS блочного элемента, содержащего текст и изображения. Работает для разных комбинаций блочных и строчных элементов. Пример: Вертикальное выравнивание CSS Вертикальное выравнивание CSS HTML / XHTML. Код: <div class="parent"> <div class="child"> <div class="childcontent">Вертикальное выравнивание CSS</div> <div class="childcontent"><img src="image.jpg" width="68" height="68" alt="Image" /></div> <div class="childcontent">Вертикальное выравнивание CSS</div> </div> </div> CSS. Код: .parent {position: relative; left: 0px; top: 0px; height: 200px; display: table;} .child {position: relative; left: 0px; top: 0px; display: table-cell; vertical-align: middle;} .childcontent {position: relative; left: 0px; top: 0px;} Примечание: .parent и .childcontent могут быть выровнены по левому краю ("float: left;") или не выровнены, но чтобы этот способ вертикального выравнивания CSS сработал, .child должен быть без "float: left;". [ 1 ] А так же в Netscape 6.01+, Mozilla 0.6+. [ 2 ] А так же в Netscape 6.01+, Mozilla 0.6+.

Lynx. Извлечение данных из веб-страниц

 

Помимо просмотра / отображения веб-страниц, Lynx может выводить форматированный текст содержания веб-документа или его HTML источник на стандартный вывод. И это затем может быть обработано с помощью некоторых инструментов, имеющихся в Linux, таких как gawk, Perl, sed, grep, и т.д. Некоторые примеры: Работа с внешними ссылками Подсчитать количество внешних ссылок Lynx выводит список ссылок из содержимого веб-документа на стандартный вывод. Grep ищет только строки, начинающиеся с "http:", перенаправляет результат далее, опять для grep, который выбирает из них строки не начинающиеся с "http://compmiscellanea.com" and "http://www.compmiscellanea.com" (внешние ссылки веб-страницы), wc подсчитывает число извлеченных внешних ссылок и отображает его: lynx -dump -listonly "http://compmiscellanea.com/en/elinks.htm" | grep -o "http:.*" | grep -E -v "http://compmiscellanea.com|http://www.compmiscellanea.com" | wc -l Найти внешние ссылки и сохранить их в файл Lynx выводит список ссылок из содержимого веб-документа на стандартный вывод. Grep ищет только строки, начинающиеся с "http:", перенаправляет результат далее, опять для grep, который выбирает из них строки не начинающиеся с "http://compmiscellanea.com" and "http://www.compmiscellanea.com" (внешние ссылки веб-страницы) и сохраняет их в файл: lynx -dump -listonly "http://compmiscellanea.com/en/elinks.htm" | grep -o "http:.*" | grep -E -v "http://compmiscellanea.com|http://www.compmiscellanea.com" > file.txt Найти внешние ссылки, опустить повторяющиеся записи и сохранить результат в файл Lynx выводит список ссылок из содержимого веб-документа на стандартный вывод. Grep ищет только строки, начинающиеся с "http:", перенаправляет результат далее, опять для grep, который выбирает из них строки не начинающиеся с "http://compmiscellanea.com" and "http://www.compmiscellanea.com" (внешние ссылки веб-страницы), sort сортирует их, а uniq удаляет повторяющиеся записи. Результат сохраняется в файл: lynx -dump -listonly "http://compmiscellanea.com/en/elinks.htm" | grep -o "http:.*" | grep -E -v "http://compmiscellanea.com|http://www.compmiscellanea.com" | sort | uniq > file.txt Работа с внутренними ссылками Подсчитать количество внутренних ссылок Lynx выводит список ссылок из содержимого веб-документа на стандартный вывод. Grep ищет только строки, начинающиеся с "http://compmiscellanea.com" and "http://www.compmiscellanea.com" (внутренние ссылки), wc подсчитывает число извлеченных внутренних ссылок и отображает его: lynx -dump -listonly "http://compmiscellanea.com/en/elinks.htm" | grep -E -o "http://compmiscellanea.com.*|http://www.compmiscellanea.com.*" | wc -l Найти внутренние ссылки и сохранить их в файл Lynx выводит список ссылок из содержимого веб-документа на стандартный вывод. Grep ищет только строки, начинающиеся с "http://compmiscellanea.com" and "http://www.compmiscellanea.com" (внутренние ссылки) и сохраняет их в файл: lynx -dump -listonly "http://compmiscellanea.com/en/elinks.htm" | grep -E -o "http://compmiscellanea.com.*|http://www.compmiscellanea.com.*" > file.txt Найти внутренние ссылки, опустить повторяющиеся записи и сохранить результат в файл Lynx выводит список ссылок из содержимого веб-документа на стандартный вывод. Grep ищет только строки, начинающиеся с "http://compmiscellanea.com" and "http://www.compmiscellanea.com" (внутренние ссылки), sort сортирует их, а uniq удаляет повторяющиеся записи.